/*
Theme Name: Unity Group
Theme URI: https://ourunitygroup.com
Author: Revamp Webz
Author URI: https://revampwebz.com
Description: Custom Elementor child theme for Our Unity Group — property management and concierge services in Marble Falls, TX.
Version: 1.0.0
Template: hello-elementor
Text Domain: unity-group
*/

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500&family=DM+Sans:opsz,wght@9..40,300;9..40,400;9..40,500;9..40,600&family=Montserrat:wght@400;500;600;700&display=swap');

/* ── CSS Custom Properties ──────────────────────── */
:root {
  --unity-navy:    #1C2835;
  --unity-cream:   #F8F4EE;
  --unity-sage:    #5A8C7C;
  --unity-sage-l:  #7BAB9D;
  --unity-gold:    #B8956A;
  --unity-white:   #FFFFFF;
  --unity-text:    #2D3A45;
  --unity-text-l:  #6B7A8D;
  --unity-border:  #E2D9CE;
}

/* ── Global ─────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }

body {
  font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  color: var(--unity-text);
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Playfair Display', Georgia, serif;
  font-weight: 500;
}

/* ── Hello Elementor Header ─────────────────────── */
.site-header {
  background: var(--unity-navy) !important;
  border-bottom: 1px solid rgba(255,255,255,0.06) !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 999 !important;
}

.site-header .site-branding .site-title a {
  font-family: 'Playfair Display', serif !important;
  font-weight: 600 !important;
  color: #fff !important;
  font-size: 18px !important;
}

.main-navigation .menu-item a {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 1.8px !important;
  text-transform: uppercase !important;
  color: rgba(255,255,255,0.75) !important;
  transition: color 0.2s !important;
}

.main-navigation .menu-item a:hover,
.main-navigation .current-menu-item > a {
  color: var(--unity-sage-l) !important;
}

/* ── Elementor Heading em tag ───────────────────── */
.elementor-widget-heading h1 em,
.elementor-widget-heading h2 em,
.elementor-widget-heading h3 em {
  color: #C4E0D8;
  font-style: italic;
}

/* ── Button hover ───────────────────────────────── */
.elementor-widget-button .elementor-button {
  transition: transform 0.2s, box-shadow 0.2s !important;
}
.elementor-widget-button .elementor-button:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 24px rgba(90, 140, 124, 0.35) !important;
}

/* ── Icon Box hover ─────────────────────────────── */
.elementor-widget-icon-box {
  transition: transform 0.3s, box-shadow 0.3s;
}
.elementor-widget-icon-box:hover {
  transform: translateY(-4px);
  box-shadow: 0 20px 48px rgba(28,40,53,0.08);
}

/* ── Section max-width ──────────────────────────── */
.elementor-section .elementor-container { max-width: 1200px; }

/* ── Responsive ─────────────────────────────────── */
@media (max-width: 768px) {
  .elementor-section .elementor-container { padding: 0 20px; }
  .elementor-column { padding: 0 12px !important; }
}

/* ── Utility CSS Classes ────────────────────────── */
.unity-sage-bg    { background-color: var(--unity-sage)  !important; }
.unity-navy-bg    { background-color: var(--unity-navy)  !important; }
.unity-cream-bg   { background-color: var(--unity-cream) !important; }
.unity-sage-text  { color: var(--unity-sage) !important; }
.unity-gold-text  { color: var(--unity-gold) !important; }