/*===========================================
  THE FIVE - COMPLETE VISUAL FIX V2
  All layout, z-index, color theory and visibility issues resolved
===========================================*/

:root {
  /* UNIFIED LUXURY COLOR PALETTE - Mediterranean Gold & Navy */
  --theme-color: #0A1F3D;
  --theme-color2: #D4AF37;
  --theme-color3: #1A1A2E;
  --title-color: #0A0E27;
  --title-dark: #16213E;
  --body-color: #5B6670;

  /* PRIMARY GOLD ACCENTS - Unified Button Scheme */
  --accent-gold: #D4AF37;
  --accent-gold-light: #E6C65A;
  --accent-gold-dark: #B8943A;

  /* SECONDARY - Subtle Royal Touches (Used sparingly) */
  --accent-navy: #0D2847;
  --accent-navy-light: #163a5f;

  /* UNIFIED GRADIENTS - No more clashing purples */
  --gradient-primary: linear-gradient(135deg, #0A1F3D 0%, #0D2847 100%);
  --gradient-gold: linear-gradient(135deg, #D4AF37 0%, #E6C65A 100%);
  --gradient-gold-hover: linear-gradient(135deg, #E6C65A 0%, #D4AF37 100%);
  --gradient-card: linear-gradient(180deg, rgba(10, 31, 61, 0.98) 0%, rgba(13, 40, 71, 0.95) 100%);
  --gradient-hero-overlay: linear-gradient(135deg, rgba(10, 31, 61, 0.85) 0%, rgba(22, 33, 62, 0.75) 100%);

  /* SPACING */
  --section-space: 60px;
  --container-width: 1140px;

  /* SHADOWS */
  --shadow-gold: 0 8px 25px rgba(212, 175, 55, 0.35);
  --shadow-gold-hover: 0 12px 35px rgba(212, 175, 55, 0.5);
  --shadow-card: 0 10px 35px rgba(10, 31, 61, 0.12);
  --shadow-dark: 0 15px 40px rgba(0, 0, 0, 0.25);
}

/* =============================================
   COMPACT MAC DOCK STYLE FLOATING NAVBAR - ALWAYS FLOATING
============================================= */
.th-header {
  z-index: 1000 !important;
  position: fixed !important;
  top: 0;
  left: 0;
  right: 0;
  padding: 10px 24px 0 24px !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.sticky-wrapper {
  z-index: 1000 !important;
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
  padding: 0 !important;
  position: static !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.sticky-wrapper.sticky {
  position: static !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* Prevent content from going under fixed navbar */
.th-hero-wrapper {
  padding-top: 80px !important;
  margin-top: 0 !important;
}

/* Fix section spacing to prevent overlap */
section {
  position: relative !important;
  z-index: 1 !important;
}

/* Reset padding for first section */
section:first-of-type {
  margin-top: 0 !important;
}

/* Ensure amenities icons are visible */
.aminities-card-icon,
.aminities-card-icon img {
  opacity: 1 !important;
  visibility: visible !important;
  display: block !important;
  z-index: 10 !important;
}

.aminities-card .aminities-content {
  z-index: 10 !important;
  position: relative !important;
}

/* Change amenities icon color to dark */
.aminities-card-icon img {
  filter: brightness(0) saturate(100%) invert(10%) !important;
}

/* Hide left/right navigation circles in amenities slider */
#aminitiesSlider1 .slider-arrow.slider-prev,
#aminitiesSlider1 .slider-arrow.slider-next {
  display: none !important;
}

/* Fix amenities card height - reduce negative space */
.aminities-card {
  max-height: 280px !important;
  height: auto !important;
  padding: 15px !important;
}

.aminities-card-img {
  height: 120px !important;
  object-fit: cover !important;
}

.aminities-card .aminities-content {
  padding: 10px 0 !important;
  margin-top: 10px !important;
}

.aminities-card .box-title {
  font-size: 14px !important;
  margin: 8px 0 0 0 !important;
}

.aminities-card-icon {
  width: 40px !important;
  height: 40px !important;
}

/* MAC DOCK STYLE - ENHANCED RETINA GLASS - ALWAYS FLOATING */
.menu-area {
  background: rgba(10, 10, 20, 0.35) !important;
  backdrop-filter: saturate(250%) blur(60px) brightness(1.1) !important;
  -webkit-backdrop-filter: saturate(250%) blur(60px) brightness(1.1) !important;
  border-radius: 16px !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.2) inset,
    0 12px 48px rgba(0, 0, 0, 0.5),
    0 0 0 1px rgba(255, 255, 255, 0.08) !important;
  padding: 3px 0 !important;
  position: relative;
  z-index: 1000 !important;
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
  max-width: 50% !important;
  margin: 0 auto !important;
}

/* Remove all backgrounds from header containers */
.th-header .row,
.th-header .container,
.th-header .container-fluid,
.sticky-wrapper .row,
.sticky-wrapper .container,
.sticky-wrapper .container-fluid {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* Override any default header backgrounds - FORCE TRANSPARENT */
.header-default,
.header-layout1,
.header-layout2,
.header-layout3,
.header-layout4,
.header-layout5,
.th-header *:not(.menu-area):not(.main-menu):not(.header-logo):not(a):not(img):not(ul):not(li) {
  background: transparent !important;
  background-color: transparent !important;
}

/* =============================================
   FIX SHADOW-TITLE BACKGROUND TEXT OVERLAP
============================================= */
.shadow-title {
  opacity: 0.04 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  position: absolute !important;
  font-size: 80px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  -webkit-text-stroke: 1px rgba(212, 175, 55, 0.15) !important;
  color: transparent !important;
}

.shadow-title.style2 {
  opacity: 0.03 !important;
}

.title-area {
  position: relative;
  z-index: 1;
}

/* =============================================
   BUTTONS - UNIFIED GOLD STYLING (FIX INCONSISTENCY)
============================================= */
.th-btn {
  background: var(--gradient-gold) !important;
  color: #0A0E27 !important;
  font-weight: 700 !important;
  box-shadow: var(--shadow-gold) !important;
  border: none !important;
  border-radius: 50px !important;
  padding: 12px 28px !important;
  /* More compact */
  font-size: 13px !important;
  /* Slightly smaller */
  transition: all 0.3s ease !important;
  position: relative;
  z-index: 1;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
}

/* Compact buttons in header */
.header-button .th-btn {
  padding: 10px 24px !important;
  font-size: 12px !important;
}

.th-btn:hover {
  transform: translateY(-2px) !important;
  /* Subtle lift */
  box-shadow: var(--shadow-gold-hover) !important;
  background: var(--gradient-gold-hover) !important;
  color: #0A0E27 !important;
}

/* UNIFIED: Style2 also uses gold (previously clashing purple) */
.th-btn.style2,
.th-btn.btn-mask2 {
  background: var(--gradient-gold) !important;
  color: #0A0E27 !important;
  border: 2px solid rgba(255, 255, 255, 0.2) !important;
}

.th-btn.style2:hover,
.th-btn.btn-mask2:hover {
  background: var(--gradient-gold-hover) !important;
  color: #0A0E27 !important;
  border-color: transparent !important;
}

/* =============================================
   HERO SECTION - IMPROVED CONTRAST & OVERLAY
============================================= */
.hero-1 {
  position: relative;
  overflow: hidden;
  z-index: 1;
}

.hero-inner {
  min-height: 600px !important;
  max-height: 800px !important;
  padding: 100px 0 120px !important;
  position: relative;
  z-index: 2;
}

/* FIX: Better Mediterranean overlay instead of neon purple */
.hero-1::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: var(--gradient-hero-overlay);
  z-index: 1;
}

.hero-big-text {
  font-size: 120px !important;
  opacity: 0.06 !important;
  position: absolute !important;
  z-index: 0 !important;
  background: var(--gradient-gold);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  pointer-events: none;
  text-shadow: none !important;
}

.hero-inner .container {
  position: relative;
  z-index: 3;
}

.hero-title {
  font-size: 48px !important;
  line-height: 1.15 !important;
  text-shadow: 0 4px 20px rgba(0, 0, 0, 0.5) !important;
  color: white !important;
  -webkit-text-fill-color: white !important;
}

.hero-text {
  color: rgba(255, 255, 255, 0.95) !important;
  font-size: 17px !important;
  line-height: 1.7 !important;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3) !important;
}

.hero-video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}

.th-hero-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* FIX: Better hero overlay - Navy to darker navy, no purple */
.th-hero-bg::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, rgba(10, 31, 61, 0.88) 0%, rgba(22, 33, 62, 0.78) 100%);
  z-index: 0;
}

/* FIX: Hero social sidebar - Better positioning */
.hero-social-link {
  z-index: 5 !important;
  position: absolute !important;
  right: 20px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
}

.hero-social-link .social-wrap {
  writing-mode: vertical-rl !important;
  text-orientation: mixed !important;
}

.hero-social-link a {
  color: rgba(255, 255, 255, 0.8) !important;
  display: block !important;
  padding: 8px 0 !important;
  font-size: 11px !important;
  letter-spacing: 1px !important;
  transition: all 0.3s ease !important;
}

.hero-social-link a:hover {
  color: var(--accent-gold) !important;
}

/* FIX: Scroll indicator styling */
.scroll-down {
  position: absolute !important;
  bottom: 30px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  z-index: 5 !important;
}

.hero-scroll-wrap {
  color: rgba(255, 255, 255, 0.7) !important;
  font-size: 12px !important;
  letter-spacing: 1px !important;
}

.play-btn.style2 {
  background: var(--gradient-gold) !important;
  border: 3px solid white !important;
  box-shadow: 0 0 0 0 rgba(212, 175, 55, 0.5), 0 8px 30px rgba(212, 175, 55, 0.4) !important;
  animation: pulse 2s infinite !important;
}

@keyframes pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(212, 175, 55, 0.6), 0 8px 30px rgba(212, 175, 55, 0.4);
  }

  70% {
    box-shadow: 0 0 0 15px rgba(212, 175, 55, 0), 0 8px 30px rgba(212, 175, 55, 0.4);
  }

  100% {
    box-shadow: 0 0 0 0 rgba(212, 175, 55, 0), 0 8px 30px rgba(212, 175, 55, 0.4);
  }
}

.play-btn.style2 i {
  color: #0A0E27 !important;
}

/* =============================================
   COMPACT LOGO SIZING
============================================= */
.header-logo img {
  max-width: 75px !important;
  max-height: 40px !important;
  height: auto !important;
  object-fit: contain !important;
  transition: all 0.3s ease !important;
}

.sticky-wrapper.sticky .header-logo img {
  max-width: 75px !important;
  max-height: 40px !important;
}

.mobile-logo img,
.about-logo img {
  max-width: 120px !important;
  height: auto !important;
}

/* =============================================
   COMPACT MAIN MENU
============================================= */
.main-menu>ul>li {
  margin: 0 8px !important;
}

.main-menu>ul>li>a {
  color: rgba(255, 255, 255, 0.95) !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  transition: all 0.3s ease !important;
  padding: 4px 0 !important;
  letter-spacing: 0.3px !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) !important;
}

.main-menu>ul>li>a:hover {
  color: var(--accent-gold) !important;
  text-shadow: 0 0 8px rgba(212, 175, 55, 0.4) !important;
}

/* =============================================
   COUNTER CARDS - UNIFIED GOLD SCHEME
============================================= */
.counter-area-1 {
  position: relative;
  z-index: 10;
  background: var(--theme-color) !important;
  background-color: var(--theme-color) !important;
  margin-top: -80px !important;
  padding-top: 40px !important;
}

/* Force theme background - override bg-smoke */
.counter-area-1.bg-smoke {
  background: var(--theme-color) !important;
  background-color: var(--theme-color) !important;
}

.counter-card {
  background: rgba(10, 31, 61, 0.8) !important;
  border: 2px solid var(--accent-gold) !important;
  border-radius: 20px !important;
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15) !important;
  transition: all 0.3s ease !important;
  padding: 30px 25px !important;
}

.counter-card:hover {
  transform: translateY(-8px) !important;
  box-shadow: 0 12px 35px rgba(212, 175, 55, 0.4) !important;
}

.counter-card .box-number {
  color: var(--accent-gold) !important;
  font-size: 36px !important;
  font-weight: 800 !important;
}

.counter-card .box-text {
  color: white !important;
  font-weight: 600 !important;
  letter-spacing: 1.5px !important;
  font-size: 12px !important;
}

/* Hide play button from hero section */
.hero-1 .play-btn,
.th-hero-bg .play-btn,
.hero-style1 .play-btn {
  display: none !important;
}

/* =============================================
   BACKGROUND THEME SECTIONS
============================================= */
.bg-theme {
  background: var(--gradient-primary) !important;
  position: relative;
  overflow: hidden;
}

.bg-theme::after {
  content: '';
  position: absolute;
  top: -50%;
  right: -50%;
  width: 200%;
  height: 200%;
  background: radial-gradient(circle, rgba(212, 175, 55, 0.06) 0%, transparent 70%);
  animation: rotate 50s linear infinite;
  pointer-events: none;
  z-index: 0;
}

@keyframes rotate {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}

.bg-theme .container {
  position: relative;
  z-index: 1;
}

/* =============================================
   SECTION TITLES - FIXED VISIBILITY
============================================= */
.sec-title {
  background: var(--gradient-gold) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  font-size: 36px !important;
  font-weight: 700 !important;
  position: relative;
  z-index: 2;
}

.sec-title.text-white {
  background: none !important;
  -webkit-text-fill-color: white !important;
  color: white !important;
}

.sec-text {
  font-size: 16px !important;
  line-height: 1.7 !important;
  position: relative;
  z-index: 2;
}

.sec-text.text-white {
  color: rgba(255, 255, 255, 0.85) !important;
}

/* =============================================
   ABOUT SECTION - FIX CIRCULAR TEXT CLIPPING
============================================= */
.about-tag {
  position: relative !important;
  overflow: visible !important;
}

.about-experience-tag {
  overflow: visible !important;
}

.circle-title-anime {
  font-size: 14px !important;
  letter-spacing: 2px !important;
}

.img-box1 {
  position: relative !important;
  overflow: hidden !important;
  border-radius: 20px !important;
}

.img-box1 img {
  max-height: 380px !important;
  width: 100% !important;
  object-fit: cover !important;
  border-radius: 20px !important;
  transition: transform 0.4s ease !important;
}

.img-box1:hover img {
  transform: scale(1.03) !important;
}

/* =============================================
   SERVICE/FEATURE CARDS - FIX SPACING & BORDER
============================================= */
.service-area-1 {
  padding-top: 40px !important;
}

.service-card {
  background: rgba(255, 255, 255, 0.08) !important;
  backdrop-filter: blur(15px) !important;
  border: 1px solid rgba(212, 175, 55, 0.25) !important;
  border-radius: 25px !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15) !important;
  transition: all 0.4s ease !important;
  padding: 35px 30px !important;
  position: relative;
  z-index: 1;
  min-height: 280px !important;
}

.service-card:hover {
  background: rgba(212, 175, 55, 0.1) !important;
  border-color: var(--accent-gold) !important;
  transform: translateY(-10px) !important;
  box-shadow: 0 20px 45px rgba(212, 175, 55, 0.25) !important;
}

.service-card .box-title a {
  background: var(--gradient-gold);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  font-size: 20px !important;
  font-weight: 700 !important;
}

.service-card .box-text {
  color: rgba(255, 255, 255, 0.85) !important;
  font-size: 14px !important;
  line-height: 1.7 !important;
  margin-top: 12px !important;
}

.service-card-icon .icon {
  filter: drop-shadow(0 0 15px rgba(255, 215, 0, 0.5)) !important;
}

/* =============================================
   UNIT TYPES GALLERY - FIX CAROUSEL ARROWS
============================================= */
.project-area-1 {
  position: relative !important;
  z-index: 5 !important;
}

.project-area-1::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background: linear-gradient(135deg, rgba(10, 31, 61, 0.95) 0%, rgba(22, 33, 62, 0.9) 100%) !important;
  z-index: 1 !important;
}

.project-area-1 .container {
  position: relative !important;
  z-index: 2 !important;
}

.project-title-wrap1 {
  position: relative !important;
  z-index: 3 !important;
}

/* FIX: Carousel arrows with proper contrast */
.project-slider-area .icon-btn {
  background: var(--gradient-gold) !important;
  border: 2px solid rgba(10, 31, 61, 0.3) !important;
  border-radius: 50% !important;
  width: 55px !important;
  height: 55px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: var(--shadow-gold) !important;
  transition: all 0.3s ease !important;
}

.project-slider-area .icon-btn:hover {
  transform: scale(1.1) !important;
  box-shadow: var(--shadow-gold-hover) !important;
}

.project-slider-area .icon-btn img {
  filter: brightness(0) !important;
  width: 16px !important;
}

/* Project Number Pagination */
.project-number-pagination .tab-btn {
  color: rgba(255, 255, 255, 0.5) !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  transition: all 0.3s ease !important;
}

.project-number-pagination .tab-btn.active {
  color: var(--accent-gold) !important;
  transform: scale(1.2) !important;
}

/* =============================================
   PROPERTY CARDS - FIX TEXT OVERLAP
============================================= */
.property-card-wrap {
  position: relative;
  z-index: 1;
  margin-bottom: 40px;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: stretch !important;
  gap: 30px !important;
}

.property-card {
  background: white !important;
  border: none !important;
  border-radius: 20px !important;
  box-shadow: var(--shadow-card) !important;
  transition: all 0.4s ease !important;
  padding: 30px !important;
  position: relative;
  z-index: 1;
  flex: 1 !important;
  min-width: 320px !important;
}

.property-card:hover {
  transform: translateY(-8px) !important;
  box-shadow: 0 20px 50px rgba(212, 175, 55, 0.2) !important;
  border: 2px solid var(--accent-gold) !important;
}

/* FIX: Property card number - Reduce size to prevent overlap */
.property-card-number {
  color: var(--accent-gold) !important;
  font-size: 40px !important;
  font-weight: 800 !important;
  opacity: 0.12 !important;
  position: absolute !important;
  top: 10px !important;
  right: 20px !important;
  z-index: 0 !important;
  pointer-events: none !important;
}

/* FIX: Property card details - Proper z-index and positioning */
.property-card-details {
  position: relative !important;
  z-index: 2 !important;
}

.property-card-subtitle {
  color: var(--accent-gold) !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  margin-bottom: 8px !important;
  display: block !important;
}

.property-card-title a {
  color: var(--title-color) !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  display: block !important;
  margin-bottom: 10px !important;
}

.property-card-text {
  color: var(--body-color) !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
  margin-bottom: 15px !important;
}

.property-card-price-meta {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  margin-bottom: 15px !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
}

.property-card-price {
  color: var(--theme-color) !important;
  font-size: 24px !important;
  font-weight: 800 !important;
  margin: 0 !important;
}

.star-ratting {
  color: var(--accent-gold) !important;
  font-weight: 600 !important;
  font-size: 14px !important;
}

.property-card-meta {
  margin-bottom: 20px !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 15px !important;
}

.property-card-meta span {
  color: var(--body-color) !important;
  font-size: 13px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
}

.property-card-meta span img {
  width: 18px !important;
  height: 18px !important;
  filter: brightness(0) saturate(100%) invert(25%) sepia(20%) saturate(400%) hue-rotate(180deg) brightness(95%) !important;
}

/* FIX: Property button wrap - Prevent overflow */
.property-btn-wrap {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 15px !important;
  padding-top: 15px !important;
  border-top: 1px solid rgba(10, 31, 61, 0.1) !important;
}

.property-author-wrap {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

.property-author-wrap img {
  width: 40px !important;
  height: 40px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
}

.property-author-wrap a {
  color: var(--title-color) !important;
  font-weight: 600 !important;
  font-size: 14px !important;
}

.property-thumb {
  border-radius: 15px !important;
  overflow: hidden;
  flex: 0 0 45% !important;
  max-width: 45% !important;
}

.property-thumb img {
  max-height: 380px !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

/* =============================================
   AMENITIES CARDS - FIX CLIPPING
============================================= */
.aminities-card {
  background: white !important;
  border-radius: 20px !important;
  overflow: visible !important;
  box-shadow: var(--shadow-card) !important;
  transition: all 0.3s ease !important;
  display: flex !important;
  flex-direction: column !important;
  min-height: 260px !important;
  padding: 0 !important;
}

.aminities-card:hover {
  transform: translateY(-8px) !important;
  box-shadow: 0 15px 40px rgba(212, 175, 55, 0.2) !important;
}

.aminities-card-img {
  height: 160px !important;
  overflow: hidden;
  border-radius: 20px 20px 0 0 !important;
}

.aminities-card-img img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

.aminities-content {
  padding: 20px 15px !important;
  text-align: center;
  background: white !important;
  border-radius: 0 0 20px 20px !important;
  flex: 1 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: center !important;
}

.aminities-content .box-title {
  color: var(--title-color) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  margin-top: 8px !important;
}

.aminities-card-icon img {
  width: 40px !important;
  height: 40px !important;
}

/* =============================================
   PAYMENT CALCULATOR - FIX POSITIONING
============================================= */
.calculator-area {
  position: relative !important;
  z-index: 5 !important;
  overflow: visible !important;
}

.calculator-area .container {
  position: relative;
  z-index: 1;
}

.calculator-card {
  background: rgba(255, 255, 255, 0.06) !important;
  backdrop-filter: blur(20px) !important;
  border: 1px solid rgba(212, 175, 55, 0.3) !important;
  border-radius: 25px !important;
  padding: 40px !important;
  box-shadow: var(--shadow-dark) !important;
  max-width: 800px !important;
  margin: 0 auto !important;
  position: relative !important;
  z-index: 1 !important;
}

.calc-form-group {
  margin-bottom: 20px;
}

.calc-form-group label {
  color: var(--accent-gold) !important;
  display: block;
  margin-bottom: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-size: 13px;
}

.calc-select,
.calc-input {
  width: 100%;
  padding: 15px 20px;
  background: rgba(255, 255, 255, 0.1) !important;
  border: 1px solid rgba(212, 175, 55, 0.3) !important;
  border-radius: 12px;
  color: white !important;
  outline: none;
  transition: all 0.3s ease;
  font-size: 15px;
}

.calc-select:focus,
.calc-input:focus {
  border-color: var(--accent-gold) !important;
  background: rgba(255, 255, 255, 0.15) !important;
}

.calc-select option {
  background: #0A1F3D;
  color: white;
}

.calc-result-wrap {
  background: rgba(0, 0, 0, 0.2) !important;
  border-radius: 15px;
  padding: 25px;
  margin-top: 25px;
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap;
  gap: 15px;
  border: 1px solid rgba(255, 255, 255, 0.15);
}

.calc-result-item {
  text-align: center;
}

.calc-result-label {
  display: block;
  font-size: 13px;
  color: rgba(255, 255, 255, 0.7) !important;
  margin-bottom: 5px;
}

.calc-result-value {
  display: block;
  font-size: 22px;
  font-weight: 800;
  color: var(--accent-gold) !important;
}

.calc-disclaimer {
  font-size: 12px;
  color: rgba(255, 255, 255, 0.5);
  margin-top: 20px;
  text-align: center;
}

/* =============================================
   TEAM SECTION - FIX CONTRAST ISSUES
============================================= */
.team-area-1 {
  position: relative;
  z-index: 5 !important;
}

.team-card {
  background: white !important;
  border-radius: 20px !important;
  box-shadow: var(--shadow-card) !important;
  overflow: hidden;
  transition: all 0.3s ease !important;
}

.team-card:hover {
  transform: translateY(-8px) !important;
  box-shadow: 0 15px 40px rgba(212, 175, 55, 0.15) !important;
}

/* FIX: Team card content - Better contrast */
.team-card-content {
  background: white !important;
  padding: 20px !important;
}

.team-card .box-title a {
  color: var(--title-color) !important;
  font-size: 18px !important;
  font-weight: 700 !important;
}

.team-desig {
  color: var(--body-color) !important;
  font-size: 13px !important;
}

/* FIX: Team slider pagination - Hide broken line */
.team-slider1 .slider-pagination {
  display: none !important;
}

/* Team social icons */
.team-card .th-social {
  display: flex !important;
  gap: 8px !important;
  margin-top: 12px !important;
}

.team-card .th-social a {
  color: var(--theme-color) !important;
  width: 32px !important;
  height: 32px !important;
  border-radius: 50% !important;
  background: rgba(10, 31, 61, 0.08) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 13px !important;
  transition: all 0.3s ease !important;
}

.team-card .th-social a:hover {
  background: var(--gradient-gold) !important;
  color: #0A0E27 !important;
}

/* =============================================
   TESTIMONIALS - FIX BACKGROUND & CONTRAST
============================================= */
.testi-sec-1 {
  position: relative;
  z-index: 5;
  background: var(--gradient-primary) !important;
}

.testi-card {
  background: rgba(255, 255, 255, 0.06) !important;
  backdrop-filter: blur(10px) !important;
  border: 1px solid rgba(212, 175, 55, 0.25) !important;
  border-radius: 25px !important;
  box-shadow: var(--shadow-dark) !important;
  padding: 35px !important;
  position: relative;
  z-index: 1;
}

.testi-card:hover {
  border-color: var(--accent-gold) !important;
  box-shadow: 0 20px 50px rgba(212, 175, 55, 0.2) !important;
}

/* FIX: Testimonial text visibility */
.testi-card_text {
  color: rgba(255, 255, 255, 0.9) !important;
  font-size: 16px !important;
  line-height: 1.75 !important;
  font-style: italic;
}

.testi-grid_review i {
  color: var(--accent-gold) !important;
}

.testi-card_name {
  color: white !important;
  font-weight: 700 !important;
  font-size: 18px !important;
}

.testi-card_desig {
  color: rgba(255, 255, 255, 0.7) !important;
  font-size: 13px !important;
}

.quote-icon img {
  opacity: 0.2;
  filter: brightness(0) invert(1);
}

/* FIX: Testi thumb wrap positioning */
.testi-thumb-wrap {
  position: relative !important;
}

.testi-thumb-wrap .img1,
.testi-thumb-wrap .img2 {
  border-radius: 20px !important;
  overflow: hidden !important;
}

.testi-thumb-wrap .img2 {
  position: absolute !important;
  bottom: -20px !important;
  right: -20px !important;
  max-width: 200px !important;
  z-index: 2 !important;
}

/* Testimonial section title */
.testi-sec-1 .sec-title {
  background: var(--gradient-gold) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}

/* =============================================
   CTA SECTIONS
============================================= */
.cta-area-1,
.cta-area-2 {
  position: relative;
  overflow: hidden;
  z-index: 5;
}

/* =============================================
   BLOG CARDS
============================================= */
.blog-grid {
  background: white !important;
  border-radius: 20px !important;
  box-shadow: var(--shadow-card) !important;
  overflow: hidden;
  margin-bottom: 30px;
  padding: 0 !important;
}

.blog-grid:hover {
  box-shadow: 0 15px 40px rgba(212, 175, 55, 0.15) !important;
}

.blog-content {
  padding: 25px !important;
}

.blog-content .subtitle {
  color: var(--accent-gold) !important;
  font-weight: 600 !important;
  text-transform: uppercase;
  font-size: 12px;
  letter-spacing: 1px;
}

.blog-content .box-title a {
  color: var(--title-color) !important;
  font-size: 20px !important;
  font-weight: 700 !important;
}

.blog-text {
  color: var(--body-color) !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
}

.blog-date {
  color: var(--body-color) !important;
}

/* =============================================
   PORTFOLIO CARDS
============================================= */
.portfolio-card {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* =============================================
   FOOTER - FIX LAYOUT & LEGIBILITY
============================================= */
.footer-wrapper {
  background: var(--gradient-primary) !important;
  position: relative;
  z-index: 10;
}

.footer-wrap {
  padding: 60px 0 30px !important;
  position: relative;
  z-index: 1;
}

.footer-wrap.bg-smoke {
  background: rgba(255, 255, 255, 0.03) !important;
}

.footer-widget {
  margin-bottom: 30px;
}

.footer-widget .widget_title {
  color: var(--accent-gold) !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  margin-bottom: 20px !important;
}

/* FIX: Better footer text legibility */
.footer-widget .about-text {
  color: rgba(255, 255, 255, 0.8) !important;
  font-size: 14px !important;
  line-height: 1.7 !important;
}

.footer-widget .menu a {
  color: rgba(255, 255, 255, 0.8) !important;
  font-size: 14px !important;
  transition: all 0.3s ease !important;
}

.footer-widget .menu a:hover {
  color: var(--accent-gold) !important;
  padding-left: 5px !important;
}

.th-widget-contact .info-box_text {
  display: flex !important;
  gap: 15px !important;
  margin-bottom: 15px !important;
}

.th-widget-contact .details p,
.th-widget-contact .details a {
  color: rgba(255, 255, 255, 0.8) !important;
  font-size: 14px !important;
}

.th-widget-contact .details a:hover {
  color: var(--accent-gold) !important;
}

.th-social a {
  color: white !important;
  transition: all 0.3s ease !important;
}

.th-social a:hover {
  color: var(--accent-gold) !important;
  transform: translateY(-3px) !important;
}

.newsletter-wrap {
  background: rgba(255, 255, 255, 0.05) !important;
  border-radius: 20px !important;
  padding: 30px !important;
  margin-top: 30px !important;
  border: 1px solid rgba(212, 175, 55, 0.2) !important;
}

.newsletter-title {
  color: white !important;
  font-size: 18px !important;
  margin-bottom: 20px !important;
}

.newsletter-form .form-control {
  background: rgba(255, 255, 255, 0.1) !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  color: white !important;
  border-radius: 10px !important;
  padding: 12px 20px !important;
}

.newsletter-form .form-control::placeholder {
  color: rgba(255, 255, 255, 0.5) !important;
}

/* FIX: Copyright text - Better legibility */
.copyright-wrap {
  background: rgba(0, 0, 0, 0.2) !important;
  padding: 20px 0 !important;
  border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
}

.copyright-text {
  color: rgba(255, 255, 255, 0.7) !important;
  font-size: 14px !important;
}

.copyright-text a {
  color: var(--accent-gold) !important;
}

.footer-links a {
  color: rgba(255, 255, 255, 0.7) !important;
  font-size: 14px !important;
}

.footer-links a:hover {
  color: var(--accent-gold) !important;
}

/* =============================================
   VIDEO AREA
============================================= */
.video-area-1 {
  position: relative;
  z-index: 5;
  padding-bottom: 60px !important;
  margin-bottom: 40px !important;
}

.video-wrap1 {
  background: white !important;
  border-radius: 25px !important;
  box-shadow: 0 15px 50px rgba(10, 31, 61, 0.12) !important;
  overflow: visible !important;
}

.video-box1 {
  overflow: hidden !important;
  border-radius: 25px 25px 0 0 !important;
}

.video-wrap-details {
  padding: 40px !important;
}

.video-wrap-details .sec-title {
  font-size: 28px !important;
}

.video-wrap-details .sec-text {
  color: var(--body-color) !important;
}

/* Prevent calculator section from overlapping video section */
.calculator-area {
  margin-top: 60px !important;
}

.author-profile-name {
  color: var(--title-color) !important;
}

.author-desig {
  color: var(--body-color) !important;
}

/* =============================================
   DOWNLOAD/LOCATION AREA
============================================= */
.download-area-1 {
  position: relative;
  z-index: 5;
}

.download-area-1::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, rgba(10, 31, 61, 0.92) 0%, rgba(22, 33, 62, 0.88) 100%);
  z-index: 1;
}

.download-area-1 .container {
  position: relative;
  z-index: 2;
}

/* =============================================
   SPACING & TYPOGRAPHY
============================================= */
.space,
.space-top,
.space-bottom {
  padding-top: var(--section-space) !important;
  padding-bottom: var(--section-space) !important;
}

.container {
  max-width: var(--container-width) !important;
}

h2,
.sec-title {
  font-size: 36px !important;
}

h3,
.box-title {
  font-size: 20px !important;
}

p,
.sec-text,
.box-text {
  font-size: 15px !important;
}

/* =============================================
   IMAGE STYLING
============================================= */
.img-shine {
  position: relative;
  overflow: hidden;
  border-radius: 15px;
}

.img-shine::after {
  content: '';
  position: absolute;
  top: -100%;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(45deg, transparent, rgba(255, 255, 255, 0.2), transparent);
  transition: all 0.6s ease;
}

.img-shine:hover::after {
  top: 100%;
  left: 100%;
}

/* =============================================
   SLIDERS - UNIFIED ARROW STYLING
============================================= */
.slider-arrow {
  background: var(--gradient-gold) !important;
  border: none !important;
  border-radius: 50% !important;
  width: 50px !important;
  height: 50px !important;
  box-shadow: var(--shadow-gold) !important;
  transition: all 0.3s ease !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.slider-arrow:hover {
  transform: scale(1.1) !important;
  box-shadow: var(--shadow-gold-hover) !important;
}

.slider-arrow img {
  filter: brightness(0) !important;
  width: 14px !important;
}

/* Slider pagination */
.slider-pagination {
  background: rgba(212, 175, 55, 0.2) !important;
  margin-top: 20px !important;
}

.slider-pagination .swiper-pagination-progressbar-fill {
  background: var(--accent-gold) !important;
}

/* =============================================
   MODAL FIXES
============================================= */
.th-modal .modal-content {
  background: var(--theme-color) !important;
  border-radius: 25px !important;
}

/* =============================================
   MOBILE RESPONSIVENESS
============================================= */
@media (max-width: 1199px) {
  .property-thumb {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    margin-bottom: 20px !important;
  }

  .property-card-wrap {
    flex-direction: column !important;
  }
}

@media (max-width: 992px) {
  .hero-title {
    font-size: 36px !important;
  }

  .hero-big-text {
    font-size: 70px !important;
  }

  .sec-title {
    font-size: 30px !important;
  }

  .calculator-card {
    padding: 25px !important;
  }

  .hero-social-link {
    display: none !important;
  }
}

@media (max-width: 768px) {
  .hero-inner {
    min-height: 450px !important;
    padding: 80px 0 50px !important;
  }

  .hero-title {
    font-size: 28px !important;
  }

  .hero-big-text {
    font-size: 50px !important;
  }

  .th-btn {
    padding: 12px 24px !important;
    font-size: 13px !important;
  }

  .property-card {
    padding: 20px !important;
  }

  .testi-card {
    padding: 25px !important;
  }

  .calc-result-wrap {
    flex-direction: column;
    text-align: center;
  }

  .shadow-title {
    font-size: 50px !important;
  }

  .sec-title {
    font-size: 26px !important;
  }

  .testi-thumb-wrap .img2 {
    display: none !important;
  }
}

@media (max-width: 576px) {
  .hero-title {
    font-size: 24px !important;
  }

  .sec-title {
    font-size: 22px !important;
  }

  .property-card-number {
    font-size: 30px !important;
  }

  .property-card-price {
    font-size: 20px !important;
  }
}

/* =============================================
   SCROLL TO TOP
============================================= */
.scroll-top {
  background: var(--gradient-gold) !important;
  box-shadow: var(--shadow-gold) !important;
}

/* =============================================
   PRELOADER
============================================= */
.preloader {
  background: var(--theme-color) !important;
}

.preloader .letters-loading {
  color: var(--accent-gold) !important;
}

/* =============================================
   HOVER ANIMATIONS
============================================= */
@keyframes jump {

  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-15px);
  }
}

.jump {
  animation: jump 3s ease-in-out infinite;
}

/* =============================================
   ICON BUTTON STYLING
============================================= */
.icon-btn {
  background: var(--gradient-gold) !important;
  border-radius: 50% !important;
  width: 45px !important;
  height: 45px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 0.3s ease !important;
  box-shadow: var(--shadow-gold) !important;
}

.icon-btn:hover {
  transform: scale(1.1) !important;
}

.icon-btn img {
  filter: brightness(0) !important;
  width: 16px !important;
}

/* =============================================
   FORM ELEMENTS
============================================= */
.form-control {
  background: rgba(255, 255, 255, 0.1) !important;
  border: 1px solid rgba(212, 175, 55, 0.3) !important;
  border-radius: 12px !important;
  color: white !important;
  padding: 14px 20px !important;
}

.form-control:focus {
  border-color: var(--accent-gold) !important;
  box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.15) !important;
}

textarea.form-control {
  min-height: 120px !important;
}

/* =============================================
   PLAY BUTTON STYLE 3
============================================= */
.play-btn.style3 {
  background: var(--gradient-gold) !important;
  border: 3px solid white !important;
  box-shadow: var(--shadow-gold) !important;
}

.play-btn.style3 i {
  color: #0A0E27 !important;
}

/* =============================================
   CRITICAL AGGRESSIVE OVERRIDES
   These have maximum specificity to override base style.css
============================================= */

/* FORCE ALL BUTTONS TO GOLD - No purple anywhere */
body .th-btn,
body .th-btn.style2,
body .th-btn.btn-mask,
body .th-btn.btn-mask2,
body a.th-btn,
body a.th-btn.style2,
body a.th-btn.btn-mask,
body a.th-btn.btn-mask2,
.property-btn-wrap .th-btn,
.property-btn-wrap .th-btn.btn-mask2,
.property-card .th-btn,
.property-card .th-btn.btn-mask2,
.video-wrap-details .th-btn,
.video-wrap-details .th-btn.style2,
.blog-bottom-wrap .th-btn,
.blog-content .th-btn,
.btn-wrap .th-btn,
.btn-wrap .th-btn.btn-mask2,
.sec-btn .th-btn {
  background: linear-gradient(135deg, #D4AF37 0%, #E6C65A 100%) !important;
  background-image: none !important;
  background-color: #D4AF37 !important;
  color: #0A0E27 !important;
  border: none !important;
  mask-image: none !important;
  -webkit-mask-image: none !important;
  border-radius: 50px !important;
}

body .th-btn:hover,
body .th-btn.style2:hover,
body .th-btn.btn-mask:hover,
body .th-btn.btn-mask2:hover,
body a.th-btn:hover,
body a.th-btn.style2:hover,
body a.th-btn.btn-mask:hover,
body a.th-btn.btn-mask2:hover {
  background: linear-gradient(135deg, #E6C65A 0%, #D4AF37 100%) !important;
  background-image: none !important;
  background-color: #E6C65A !important;
  color: #0A0E27 !important;
  transform: translateY(-3px) !important;
}

/* Force button icons to be dark */
body .th-btn:after,
body .th-btn.th-btn-icon:after,
body .th-btn.btn-mask2.th-btn-icon:after {
  filter: brightness(0) !important;
  -webkit-filter: brightness(0) !important;
}

/* FORCE HERO SECTION - Remove all purple glows */
.hero-1,
.hero-1 .hero-inner,
.hero-1 .th-hero-bg,
.hero-1 .th-hero-bg::after,
.hero-1::before,
.hero-1::after {
  background: linear-gradient(135deg, rgba(10, 31, 61, 0.92) 0%, rgba(13, 40, 71, 0.85) 100%) !important;
}

.hero-1 .hero-inner {
  background: transparent !important;
}

/* Remove any radial gradients that might cause purple */
.hero-1 *::before,
.hero-1 *::after {
  background-image: none !important;
}

/* Hero big text - no purple glow */
.hero-big-text {
  text-shadow: none !important;
  filter: none !important;
}

/* FORCE TESTIMONIALS SECTION - Dark navy background */
.testi-sec-1,
section.testi-sec-1,
.testi-sec-1.overflow-hidden,
.testi-sec-1.space {
  background: linear-gradient(135deg, #0A1F3D 0%, #0D2847 100%) !important;
  background-color: #0A1F3D !important;
}

/* Testimonial cards styling */
.testi-sec-1 .testi-card {
  background: rgba(255, 255, 255, 0.08) !important;
  backdrop-filter: blur(10px) !important;
  border: 1px solid rgba(212, 175, 55, 0.3) !important;
}

.testi-sec-1 .testi-card_text,
.testi-card .testi-card_text {
  color: rgba(255, 255, 255, 0.92) !important;
}

.testi-sec-1 .testi-card_name,
.testi-card .testi-card_name {
  color: white !important;
}

.testi-sec-1 .testi-card_desig,
.testi-card .testi-card_desig {
  color: rgba(255, 255, 255, 0.7) !important;
}

/* Testimonial section titles */
.testi-sec-1 .sec-title,
.testi-sec-1 .title-area .sec-title {
  background: linear-gradient(135deg, #D4AF37 0%, #E6C65A 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}

/* FORCE TEAM SECTION - White card backgrounds */
.team-area-1 .team-card,
.team-slider1 .team-card,
.th-team.team-card {
  background: white !important;
}

.team-card .team-card-content {
  background: white !important;
  padding: 20px !important;
}

.team-card .box-title,
.team-card .box-title a {
  color: #0A0E27 !important;
}

.team-card .team-desig {
  color: #5B6670 !important;
}

/* Hide broken slider pagination line in team section */
.team-slider1 .slider-pagination,
.team-area-1 .slider-pagination {
  display: none !important;
}

/* FORCE PROPERTY CARD NUMBER - No overlap */
.property-card .property-card-number {
  position: absolute !important;
  top: 8px !important;
  right: 15px !important;
  font-size: 35px !important;
  opacity: 0.08 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  color: rgba(212, 175, 55, 0.4) !important;
}

.property-card .property-card-details {
  position: relative !important;
  z-index: 5 !important;
}

/* FORCE VIDEO SECTION BUTTONS */
.video-wrap1 .th-btn,
.video-wrap-details .th-btn {
  background: linear-gradient(135deg, #D4AF37 0%, #E6C65A 100%) !important;
  color: #0A0E27 !important;
}

/* FORCE BLOG SECTION BUTTONS */
.blog-content .th-btn,
.blog-grid .th-btn,
.blog-bottom-wrap a {
  background: linear-gradient(135deg, #D4AF37 0%, #E6C65A 100%) !important;
  color: #0A0E27 !important;
}

/* Remove any lingering purple from bg-theme sections */
.bg-theme::after {
  background: radial-gradient(circle, rgba(212, 175, 55, 0.05) 0%, transparent 70%) !important;
}

/* Force service card borders - gold only, no yellow */
.service-card {
  border: 1px solid rgba(212, 175, 55, 0.3) !important;
}

.service-card:hover {
  border-color: #D4AF37 !important;
}

/* Counter cards - Unified gold scheme */
.counter-card {
  background: linear-gradient(180deg, rgba(10, 31, 61, 0.98) 0%, rgba(13, 40, 71, 0.95) 100%) !important;
  border: 2px solid #D4AF37 !important;
}

/* About section circular text fix */
.about-experience-tag,
.about-tag {
  overflow: visible !important;
}

/* CTA buttons */
.cta-area-1 .th-btn,
.cta-area-2 .th-btn,
section#contact-sec .th-btn {
  background: linear-gradient(135deg, #D4AF37 0%, #E6C65A 100%) !important;
  color: #0A0E27 !important;
}

/* Download area overlay - Navy only */
.download-area-1::before,
.download-area-1::after,
[data-overlay="title"]::before {
  background: linear-gradient(135deg, rgba(10, 31, 61, 0.94) 0%, rgba(13, 40, 71, 0.90) 100%) !important;
}

/* Project area overlay - Navy only */
.project-area-1::before,
.project-area-1::after,
section#unit-types::before {
  background: linear-gradient(135deg, rgba(10, 31, 61, 0.95) 0%, rgba(13, 40, 71, 0.90) 100%) !important;
}

/* Slider arrows - all gold */
button.slider-arrow,
.slider-arrow.slider-prev,
.slider-arrow.slider-next {
  background: linear-gradient(135deg, #D4AF37 0%, #E6C65A 100%) !important;
}

/* Read More style links */
a.link-btn,
.link-btn {
  color: #D4AF37 !important;
}

a.link-btn:hover,
.link-btn:hover {
  color: #E6C65A !important;
}

/* Icon buttons in portfolio/project section */
.portfolio-content .icon-btn,
.project-slider-area .icon-btn {
  background: linear-gradient(135deg, #D4AF37 0%, #E6C65A 100%) !important;
}