/* Custom CSS for Sudarshan Foresta Luxury Real Estate Landing Page - Mobile First & Single 3 BHK Focus */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,600;0,700;0,900;1,400&family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&family=Cinzel:wght@500;600;700;800&display=swap');

:root {
  --color-forest-primary: #1B4D3E; /* Official Sudarshan Foresta Tree Logo Green */
  --color-forest-dark: #0F3329;
  --color-forest-deep: #071C16;
  --color-forest-mid: #256653;
  --color-gold-accent: #D4AF37;
  --color-gold-light: #F4E8C1;
  --color-gold-dark: #AA820A;
  --color-champagne: #C5A059;
  --color-ivory-bg: #F9F9F6;
  --color-charcoal: #222222;
}

body {
  font-family: 'Plus Jakarta Sans', sans-serif;
  color: var(--color-charcoal);
  background-color: var(--color-ivory-bg);
  overflow-x: hidden;
  scroll-behavior: smooth;
  -webkit-tap-highlight-color: transparent;
}

.font-serif-luxury {
  font-family: 'Playfair Display', serif;
}

.font-brand-heading {
  font-family: 'Cinzel', serif;
}

/* Custom Gradients */
.bg-forest-gradient {
  background: linear-gradient(135deg, #071C16 0%, #1B4D3E 50%, #256653 100%);
}

.bg-gold-gradient {
  background: linear-gradient(135deg, #D4AF37 0%, #F4E8C1 50%, #C5A059 100%);
}

.text-gold-gradient {
  background: linear-gradient(135deg, #F3D267 0%, #F4E8C1 50%, #C5A059 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* Glassmorphism */
.glass-panel-dark {
  background: rgba(15, 51, 41, 0.90);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid rgba(212, 175, 55, 0.35);
}

.glass-panel-light {
  background: rgba(249, 249, 246, 0.95);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(212, 175, 55, 0.2);
}

/* Shadows & Accents */
.shadow-gold-glow {
  box-shadow: 0 10px 30px -10px rgba(212, 175, 55, 0.45);
}

.shadow-forest-deep {
  box-shadow: 0 20px 40px -15px rgba(7, 28, 22, 0.5);
}

/* Mobile Touch Optimization (44px min height for buttons and inputs) */
input, select, button {
  min-height: 46px;
  box-sizing: border-box !important;
  max-width: 100% !important;
}

input[type="text"],
input[type="tel"],
input[type="email"],
input[type="date"],
select {
  width: 100% !important;
  box-sizing: border-box !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

/* Fix iOS WebKit Date Input Overflow & Styling */
input[type="date"] {
  -webkit-appearance: none !important;
  appearance: none !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  display: block !important;
  margin: 0 !important;
}

input[type="date"]::-webkit-date-and-time-value {
  text-align: left !important;
  min-height: 1.4em !important;
  margin: 0 !important;
  padding: 0 !important;
}

input[type="date"]::-webkit-calendar-picker-indicator {
  cursor: pointer;
  filter: invert(0.8) sepia(100%) saturate(400%) hue-rotate(5deg);
  opacity: 0.9;
}

/* Range Slider Styling - Touch Optimized */
input[type=range] {
  -webkit-appearance: none;
  width: 100%;
  background: transparent;
  min-height: 36px;
}

input[type=range]:focus {
  outline: none;
}

input[type=range]::-webkit-slider-runnable-track {
  width: 100%;
  height: 10px;
  cursor: pointer;
  background: #0F3329;
  border-radius: 5px;
  border: 1px solid rgba(212, 175, 55, 0.4);
}

input[type=range]::-webkit-slider-thumb {
  height: 28px;
  width: 28px;
  border-radius: 50%;
  background: #D4AF37;
  cursor: pointer;
  -webkit-appearance: none;
  margin-top: -9px;
  box-shadow: 0 0 14px rgba(212, 175, 55, 1);
}

/* Tree Logo Insignia animation */
.tree-logo-pulse {
  filter: drop-shadow(0 0 6px rgba(212, 175, 55, 0.6));
}

/* Mobile Sticky Bar Safe Area Padding & Scroll Margin */
#lead-form-hero {
  scroll-margin-top: 80px;
  scroll-margin-bottom: 90px;
}

@media (max-width: 1023px) {
  .pb-mobile-sticky {
    padding-bottom: 90px;
  }
}