/* ================================================================
   TRIDENT CHIROPRACTIC — COMPLETE DESIGN SYSTEM
   Full from-scratch styling for the rebuilt homepage
   ================================================================ */

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

:root {
  --navy: #0A2240; --navy2: #0D2D50; --navy3: #1B3A5C;
  --gold: #C8A951; --gold2: #D4B96A;
  --cream: #F7F8FA; --white: #FFFFFF;
  --body: #475569; --heading: #0A2240;
}

* { -webkit-font-smoothing: antialiased; }
html { scroll-behavior: smooth; }
body { overflow-x: hidden; font-family: 'Montserrat', sans-serif; }

/* ---- HEADER ---- */
.elementor-location-header .e-con {
  backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(200,169,81,0.15) !important;
}
.elementor-location-header .elementor-nav-menu a { position: relative; transition: color 0.3s ease !important; }
.elementor-location-header .elementor-nav-menu a::after {
  content: ''; position: absolute; bottom: -4px; left: 50%; width: 0; height: 2px;
  background: linear-gradient(90deg, transparent, var(--gold), transparent);
  transition: width 0.4s ease, left 0.4s ease;
}
.elementor-location-header .elementor-nav-menu a:hover::after,
.elementor-location-header .elementor-nav-menu .current-menu-item a::after { width: 100%; left: 0; }
.elementor-location-header .elementor-button {
  box-shadow: 0 4px 15px rgba(200,169,81,0.25) !important;
  transition: all 0.4s ease !important;
}
.elementor-location-header .elementor-button:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 25px rgba(200,169,81,0.4) !important;
}

/* ==== SECTION 1: HERO ==== */
.elementor-element[data-id="bbacff1"] {
  background-image: url('https://o360v4.ocwebsitehosting.com/wp-content/uploads/2026/04/hero-clinic-interior.jpg') !important;
  background-size: cover !important;
  background-position: center center !important;
  position: relative !important;
  min-height: 90vh !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.elementor-element[data-id="bbacff1"]::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0;
  background: linear-gradient(180deg, rgba(10,34,64,0.82) 0%, rgba(10,34,64,0.65) 100%) !important;
  z-index: 1;
}
.elementor-element[data-id="bbacff1"] > .e-con-inner,
.elementor-element[data-id="bbacff1"] > .elementor-element {
  position: relative; z-index: 2;
}
.elementor-element[data-id="0c7829a"] {
  max-width: 800px !important;
  margin: 0 auto !important;
  text-align: center !important;
}
/* Hero buttons side by side */
.elementor-element[data-id="0c7829a"] .e-con { 
  display: flex !important;
  flex-direction: row !important;
  justify-content: center !important;
  gap: 16px !important;
}

/* ==== SECTION 2: STATS BAR ==== */
.elementor-element[data-id="f580ce2"] {
  background: linear-gradient(135deg, #0D2D50 0%, #1B3A5C 100%) !important;
  padding: 20px 30px !important;
}
.elementor-element[data-id="5f4e9c8"] {
  display: flex !important;
  flex-direction: row !important;
  justify-content: space-evenly !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  max-width: 1200px !important;
  margin: 0 auto !important;
}
.elementor-element[data-id="5f4e9c8"] > .e-con-inner > .e-con,
.elementor-element[data-id="5f4e9c8"] > .elementor-element.e-con {
  flex: 1 1 200px !important;
  text-align: center !important;
  padding: 25px 15px !important;
}

/* ==== SECTION 3: SERVICES (CARD GRID) ==== */
.elementor-element[data-id="bdbbe0e"] {
  background-color: #F7F8FA !important;
  padding: 100px 30px !important;
}
.elementor-element[data-id="d6fd164"] {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 24px !important;
  max-width: 1200px !important;
  margin: 0 auto !important;
}
/* Each service card */
.elementor-element[data-id="d6fd164"] > .e-con-inner > .e-con,
.elementor-element[data-id="d6fd164"] > .elementor-element.e-con {
  flex: 0 0 calc(33.333% - 16px) !important;
  max-width: calc(33.333% - 16px) !important;
  background: #FFFFFF !important;
  border: 1px solid #E2E8F0 !important;
  border-radius: 16px !important;
  padding: 45px 30px !important;
  text-align: center !important;
  box-shadow: 0 4px 24px rgba(10,34,64,0.06) !important;
  transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
}
.elementor-element[data-id="d6fd164"] > .e-con-inner > .e-con:hover,
.elementor-element[data-id="d6fd164"] > .elementor-element.e-con:hover {
  transform: translateY(-8px) !important;
  box-shadow: 0 16px 48px rgba(10,34,64,0.16) !important;
  border-color: rgba(200,169,81,0.3) !important;
}

/* ==== SECTION 4: ABOUT (SPLIT LAYOUT) ==== */
.elementor-element[data-id="2cfadd9"] {
  background: #FFFFFF !important;
  padding: 100px 30px !important;
}
.elementor-element[data-id="f20634a"] {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 60px !important;
  max-width: 1200px !important;
  margin: 0 auto !important;
}
.elementor-element[data-id="f20634a"] > .e-con-inner > .e-con:first-child,
.elementor-element[data-id="f20634a"] > .elementor-element.e-con:first-child {
  flex: 0 0 42% !important;
  max-width: 42% !important;
  /* background: removed for image */
  border-radius: 20px !important;
  min-height: 420px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 20px 50px rgba(10,34,64,0.25) !important;
}
.elementor-element[data-id="f20634a"] > .e-con-inner > .e-con:last-child,
.elementor-element[data-id="f20634a"] > .elementor-element.e-con:last-child {
  flex: 1 !important;
}

/* ==== SECTION 5: JOURNEY (4-STEP CARDS) ==== */
.elementor-element[data-id="b9b4959"] {
  background: #F7F8FA !important;
  padding: 100px 30px !important;
}
.elementor-element[data-id="53b18db"] {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 24px !important;
  max-width: 1200px !important;
  margin: 0 auto !important;
}
.elementor-element[data-id="53b18db"] > .e-con-inner > .e-con,
.elementor-element[data-id="53b18db"] > .elementor-element.e-con {
  flex: 0 0 calc(25% - 18px) !important;
  max-width: calc(25% - 18px) !important;
  background: #FFFFFF !important;
  border: 1px solid #E2E8F0 !important;
  border-bottom: 3px solid var(--gold) !important;
  border-radius: 16px !important;
  padding: 45px 25px !important;
  text-align: center !important;
  box-shadow: 0 8px 32px rgba(10,34,64,0.08) !important;
  transition: all 0.4s ease !important;
}
.elementor-element[data-id="53b18db"] > .e-con-inner > .e-con:hover,
.elementor-element[data-id="53b18db"] > .elementor-element.e-con:hover {
  transform: translateY(-6px) !important;
  box-shadow: 0 16px 48px rgba(10,34,64,0.16) !important;
}

/* ==== SECTION 6: TESTIMONIALS ==== */
.elementor-element[data-id="d15d002"] {
  background: linear-gradient(180deg, #0A2240, #0D2D50) !important;
  padding: 100px 30px !important;
}
.elementor-element[data-id="0808918"] {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 24px !important;
  max-width: 1200px !important;
  margin: 0 auto !important;
}
.elementor-element[data-id="0808918"] > .e-con-inner > .e-con,
.elementor-element[data-id="0808918"] > .elementor-element.e-con {
  flex: 0 0 calc(33.333% - 16px) !important;
  max-width: calc(33.333% - 16px) !important;
  background: rgba(255,255,255,0.07) !important;
  border: 1px solid rgba(200,169,81,0.2) !important;
  border-radius: 16px !important;
  padding: 40px 32px !important;
  text-align: center !important;
  backdrop-filter: blur(10px) !important;
  transition: all 0.4s ease !important;
}
.elementor-element[data-id="0808918"] > .e-con-inner > .e-con:hover,
.elementor-element[data-id="0808918"] > .elementor-element.e-con:hover {
  background: rgba(255,255,255,0.12) !important;
  border-color: rgba(200,169,81,0.4) !important;
  transform: translateY(-4px) !important;
  box-shadow: 0 12px 40px rgba(0,0,0,0.2) !important;
}

/* ==== SECTION 7: CONTACT (SPLIT LAYOUT) ==== */
.elementor-element[data-id="cbfb041"] {
  background: #F7F8FA !important;
  padding: 100px 30px !important;
}
.elementor-element[data-id="e2471a3"] {
  display: flex !important;
  flex-direction: row !important;
  align-items: stretch !important;
  gap: 40px !important;
  max-width: 1200px !important;
  margin: 0 auto !important;
}
.elementor-element[data-id="e2471a3"] > .e-con-inner > .e-con:first-child,
.elementor-element[data-id="e2471a3"] > .elementor-element.e-con:first-child {
  flex: 0 0 38% !important;
}
.elementor-element[data-id="e2471a3"] > .e-con-inner > .e-con:last-child,
.elementor-element[data-id="e2471a3"] > .elementor-element.e-con:last-child {
  flex: 1 !important;
  border-radius: 16px !important;
  overflow: hidden !important;
  box-shadow: 0 8px 32px rgba(10,34,64,0.10) !important;
}

/* ==== SECTION 8: CTA BANNER ==== */
.elementor-element[data-id="ccdbdb1"] {
  background: linear-gradient(135deg, #0A2240, #1B3A5C) !important;
  padding: 60px 30px !important;
}

/* ==== GLOBAL CARD ICON STYLING ==== */
.elementor-icon i { transition: all 0.4s ease !important; }
.e-con:hover > .e-con-inner .elementor-icon i,
.e-con:hover > .elementor-element .elementor-icon i { transform: scale(1.1); }

/* ==== ALL BUTTONS ==== */
.elementor-button { 
  transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important; 
  border-radius: 8px !important; 
}
.elementor-button:hover { transform: translateY(-2px) !important; }

/* ==== DIVIDERS ==== */
.elementor-divider-separator {
  background: linear-gradient(90deg, transparent, var(--gold), transparent) !important;
  border: none !important; height: 2px !important;
}

/* ==== FOOTER ==== */
.elementor-location-footer a { transition: color 0.3s ease, padding-left 0.3s ease !important; }
.elementor-location-footer a:hover { color: var(--gold) !important; padding-left: 4px; }

/* ==== SCROLL ANIMATIONS ==== */
.trident-reveal { opacity: 0; transform: translateY(40px); transition: opacity 0.8s ease, transform 0.8s ease; }
.trident-reveal.is-visible { opacity: 1; transform: translateY(0); }
.trident-stagger > .e-con-inner > .e-con, .trident-stagger > .elementor-element.e-con {
  opacity: 0; transform: translateY(30px); transition: opacity 0.6s ease, transform 0.6s ease;
}
.trident-stagger.is-visible > .e-con-inner > .e-con:nth-child(1),
.trident-stagger.is-visible > .elementor-element.e-con:nth-child(1) { opacity: 1; transform: none; transition-delay: 0.1s; }
.trident-stagger.is-visible > .e-con-inner > .e-con:nth-child(2),
.trident-stagger.is-visible > .elementor-element.e-con:nth-child(2) { opacity: 1; transform: none; transition-delay: 0.2s; }
.trident-stagger.is-visible > .e-con-inner > .e-con:nth-child(3),
.trident-stagger.is-visible > .elementor-element.e-con:nth-child(3) { opacity: 1; transform: none; transition-delay: 0.3s; }
.trident-stagger.is-visible > .e-con-inner > .e-con:nth-child(4),
.trident-stagger.is-visible > .elementor-element.e-con:nth-child(4) { opacity: 1; transform: none; transition-delay: 0.4s; }
.trident-stagger.is-visible > .e-con-inner > .e-con:nth-child(5),
.trident-stagger.is-visible > .elementor-element.e-con:nth-child(5) { opacity: 1; transform: none; transition-delay: 0.5s; }
.trident-stagger.is-visible > .e-con-inner > .e-con:nth-child(6),
.trident-stagger.is-visible > .elementor-element.e-con:nth-child(6) { opacity: 1; transform: none; transition-delay: 0.6s; }

/* ==== SCROLLBAR ==== */
::selection { background: rgba(200,169,81,0.3); color: var(--navy); }
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: var(--navy); }
::-webkit-scrollbar-thumb { background: linear-gradient(180deg, var(--gold), var(--gold2)); border-radius: 4px; }

/* ==== RESPONSIVE ==== */
@media (max-width: 1024px) {
  .elementor-element[data-id="d6fd164"] > .e-con-inner > .e-con,
  .elementor-element[data-id="d6fd164"] > .elementor-element.e-con { flex: 0 0 calc(50% - 12px) !important; max-width: calc(50% - 12px) !important; }
  .elementor-element[data-id="53b18db"] > .e-con-inner > .e-con,
  .elementor-element[data-id="53b18db"] > .elementor-element.e-con { flex: 0 0 calc(50% - 12px) !important; max-width: calc(50% - 12px) !important; }
  .elementor-element[data-id="f20634a"] { flex-direction: column !important; }
  .elementor-element[data-id="f20634a"] > .e-con-inner > .e-con:first-child,
  .elementor-element[data-id="f20634a"] > .elementor-element.e-con:first-child { flex: 0 0 100% !important; max-width: 100% !important; }
  .elementor-element[data-id="e2471a3"] { flex-direction: column !important; }
}
@media (max-width: 767px) {
  .elementor-element[data-id="bbacff1"] { min-height: 75vh !important; }
  .elementor-element[data-id="d6fd164"] > .e-con-inner > .e-con,
  .elementor-element[data-id="d6fd164"] > .elementor-element.e-con { flex: 0 0 100% !important; max-width: 100% !important; }
  .elementor-element[data-id="53b18db"] > .e-con-inner > .e-con,
  .elementor-element[data-id="53b18db"] > .elementor-element.e-con { flex: 0 0 100% !important; max-width: 100% !important; }
  .elementor-element[data-id="0808918"] > .e-con-inner > .e-con,
  .elementor-element[data-id="0808918"] > .elementor-element.e-con { flex: 0 0 100% !important; max-width: 100% !important; }
  .elementor-element[data-id="5f4e9c8"] > .e-con-inner > .e-con,
  .elementor-element[data-id="5f4e9c8"] > .elementor-element.e-con { flex: 0 0 50% !important; }
}

/* ==== IMAGE BREAK SECTION ==== */
.elementor-element[data-id="0727f49"] {
  display: flex !important;
  flex-direction: row !important;
  padding: 0 !important;
  margin: 0 !important;
  gap: 0 !important;
  overflow: hidden !important;
}
.elementor-element[data-id="1c6844b"],
.elementor-element[data-id="0c84fdb"] {
  flex: 0 0 50% !important;
  max-width: 50% !important;
  min-height: 400px !important;
  background-size: cover !important;
  background-position: center !important;
  position: relative !important;
  transition: all 0.6s ease !important;
}
.elementor-element[data-id="1c6844b"]:hover,
.elementor-element[data-id="0c84fdb"]:hover {
  transform: scale(1.02) !important;
}
@media (max-width: 767px) {
  .elementor-element[data-id="0727f49"] { flex-direction: column !important; }
  .elementor-element[data-id="1c6844b"],
  .elementor-element[data-id="0c84fdb"] { flex: 0 0 100% !important; max-width: 100% !important; min-height: 250px !important; }
}

/* ==== ABOUT SECTION IMAGE (updated) ==== */
.elementor-element[data-id="83192fe"] {
  background-size: cover !important;
  background-position: center !important;
  border-radius: 20px !important;
  min-height: 420px !important;
  box-shadow: 0 20px 50px rgba(10,34,64,0.25) !important;
  overflow: hidden !important;
  position: relative !important;
}
/* removed overlay for clean photo */

/* ==== FORCE BACKGROUND IMAGES ON SPECIFIC CONTAINERS ==== */

/* Image Break: Consultation photo (left) */
.elementor-element[data-id="1c6844b"] {
  background-image: url('https://o360v4.ocwebsitehosting.com/wp-content/uploads/2026/04/consultation-meeting.jpg') !important;
  background-size: cover !important;
  background-position: center center !important;
  min-height: 400px !important;
}

/* Image Break: Wellness photo (right) */
.elementor-element[data-id="0c84fdb"] {
  background-image: url('https://o360v4.ocwebsitehosting.com/wp-content/uploads/2026/04/wellness-rehabilitation.jpg') !important;
  background-size: cover !important;
  background-position: center center !important;
  min-height: 400px !important;
}

/* About section: Chiropractor treatment photo (left column) */
.elementor-element[data-id="83192fe"] {
  background-image: url('https://o360v4.ocwebsitehosting.com/wp-content/uploads/2026/04/chiropractor-treatment.jpg') !important;
  background-size: cover !important;
  background-position: center center !important;
  border-radius: 20px !important;
  min-height: 420px !important;
  box-shadow: 0 20px 50px rgba(10,34,64,0.25) !important;
  overflow: hidden !important;
  position: relative !important;
}
/* removed overlay for clean photo */

/* Force images to fill containers as cover */
.elementor-element[data-id="0727f49"] .elementor-image img,
.elementor-element[data-id="83192fe"] .elementor-image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}
.elementor-element[data-id="83192fe"] .elementor-widget-image {
  height: 100% !important;
}
.elementor-element[data-id="83192fe"] .elementor-image {
  height: 100% !important;
}

/* ==== IMAGE BREAK v2 - Side by side full-width images ==== */
.elementor-element[data-id="7e3c4b7"] {
  padding: 0 !important;
  margin: 0 !important;
  gap: 0 !important;
}
.elementor-element[data-id="7e3c4b7"] .elementor-image {
  line-height: 0;
}
.elementor-element[data-id="7e3c4b7"] img {
  width: 100% !important;
  height: 350px !important;
  object-fit: cover !important;
  display: block !important;
}
@media (max-width: 767px) {
  .elementor-element[data-id="7e3c4b7"] img {
    height: 250px !important;
  }
}

/* ==== IMAGE STRIP SECTION ==== */
.elementor-element[data-id="757ed52"],
.elementor-element[data-id="4a05075"] {
  padding: 0 !important;
  margin: 0 !important;
  gap: 0 !important;
}
.elementor-element[data-id="ccd8d81"],
.elementor-element[data-id="0eb5a53"] {
  padding: 0 !important;
  overflow: hidden !important;
}
.elementor-element[data-id="ccd8d81"] img,
.elementor-element[data-id="0eb5a53"] img {
  width: 100% !important;
  height: 350px !important;
  object-fit: cover !important;
  display: block !important;
  transition: transform 0.6s ease !important;
}
.elementor-element[data-id="ccd8d81"]:hover img,
.elementor-element[data-id="0eb5a53"]:hover img {
  transform: scale(1.03) !important;
}
.elementor-element[data-id="ccd8d81"] .elementor-image,
.elementor-element[data-id="0eb5a53"] .elementor-image {
  line-height: 0 !important;
  overflow: hidden !important;
}
@media (max-width: 767px) {
  .elementor-element[data-id="ccd8d81"] img,
  .elementor-element[data-id="0eb5a53"] img {
    height: 220px !important;
  }
}