/* ==========================================================================
   Team Lifeboat - Universal Hero Title Styles (Blog Aesthetic)
   Matches the typography and badge styling from the Blog hero section
   ========================================================================== */

:root {
  --hero-title-font: "Fraunces", Georgia, serif;
  --hero-badge-color: #00d1f7;
  --hero-badge-bg: rgba(0, 209, 247, 0.12);
  --hero-badge-border: rgba(0, 209, 247, 0.28);
  --hero-dark-bg: #242423;
  --hero-text-white: #ffffff;
}

/* --------------------------------------------------------------------------
   Shared Blog-Style Pill Badge
   -------------------------------------------------------------------------- */
.blog-badge,
.hero-page-badge {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 6px 18px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  color: var(--hero-badge-color) !important;
  background: var(--hero-badge-bg) !important;
  border: 1px solid var(--hero-badge-border) !important;
  border-radius: 999px !important;
  margin: 0 auto 22px auto !important;
  box-shadow: 0 0 16px rgba(0, 209, 247, 0.12) !important;
  line-height: 1.4 !important;
  width: auto !important;
  max-width: fit-content !important;
  height: auto !important;
  box-sizing: border-box !important;
}

.blog-badge::before,
.hero-page-badge::before {
  content: "" !important;
  display: inline-block !important;
  width: 6px !important;
  height: 6px !important;
  border-radius: 50% !important;
  background-color: var(--hero-badge-color) !important;
  box-shadow: 0 0 8px var(--hero-badge-color) !important;
  flex-shrink: 0 !important;
}

/* --------------------------------------------------------------------------
   Shared Hero Display Title
   -------------------------------------------------------------------------- */
.hero-page-title,
.blog-hero-title {
  font-family: var(--hero-title-font) !important;
  font-size: clamp(38px, 5.5vw, 64px) !important;
  font-weight: 600 !important;
  color: var(--hero-text-white) !important;
  line-height: 1.15 !important;
  max-width: 960px !important;
  margin: 0 auto 20px auto !important;
  letter-spacing: -0.5px !important;
  text-align: center !important;
}

.hero-page-title i,
.hero-page-title em {
  font-style: italic !important;
  font-family: var(--hero-title-font) !important;
}

/* --------------------------------------------------------------------------
   1. About Us Page Hero Title Integration
   -------------------------------------------------------------------------- */
.elementor-8 .elementor-element.elementor-element-bd30e65 {
  width: 100% !important;
  max-width: 100% !important;
  left: 0 !important;
  right: 0 !important;
  margin: 0 auto !important;
  box-sizing: border-box !important;
  background-color: #242423 !important;
  background-image: 
    radial-gradient(ellipse 70% 50% at 50% 25%, rgba(0, 209, 247, 0.16) 0%, rgba(36, 36, 35, 0) 70%),
    linear-gradient(180deg, #1b1b1a 0%, #242423 100%) !important;
  padding: 185px 20px 140px 20px !important;
  min-height: 580px !important;
  position: relative !important;
}

.elementor-8 .elementor-element.elementor-element-bd30e65 > .elementor-container {
  max-width: 1240px !important;
  margin: 0 auto !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
}

.elementor-8 .elementor-element.elementor-element-e8b45d0 > .elementor-widget-wrap {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  align-content: center !important;
  flex-wrap: nowrap !important;
  width: 100% !important;
}

.elementor-8 .elementor-element.elementor-element-f206668 {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 6px 18px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  color: var(--hero-badge-color) !important;
  background: var(--hero-badge-bg) !important;
  border: 1px solid var(--hero-badge-border) !important;
  border-radius: 999px !important;
  margin: 0 auto 22px auto !important;
  align-self: center !important;
  box-shadow: 0 0 16px rgba(0, 209, 247, 0.12) !important;
  width: auto !important;
  max-width: fit-content !important;
  height: auto !important;
}

.elementor-8 .elementor-element.elementor-element-f206668 .elementor-heading-title {
  color: var(--hero-badge-color) !important;
  font-family: "DM Sans", sans-serif !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.elementor-8 .elementor-element.elementor-element-f206668 .elementor-heading-title::before {
  content: "" !important;
  display: inline-block !important;
  width: 6px !important;
  height: 6px !important;
  border-radius: 50% !important;
  background-color: var(--hero-badge-color) !important;
  box-shadow: 0 0 8px var(--hero-badge-color) !important;
  flex-shrink: 0 !important;
}

.elementor-8 .elementor-element.elementor-element-b1391ae,
.elementor-8 .elementor-element.elementor-element-b1391ae p {
  font-family: var(--hero-title-font) !important;
  font-size: clamp(38px, 5.5vw, 64px) !important;
  font-weight: 600 !important;
  color: var(--hero-text-white) !important;
  line-height: 1.15 !important;
  width: 100% !important;
  max-width: 960px !important;
  margin: 0 auto !important;
  margin-left: auto !important;
  margin-right: auto !important;
  align-self: center !important;
  letter-spacing: -0.5px !important;
  text-align: center !important;
}

.elementor-8 .elementor-element.elementor-element-b1391ae .elementor-widget-container {
  width: 100% !important;
  text-align: center !important;
}

.elementor-8 .elementor-element.elementor-element-b1391ae i {
  font-style: italic !important;
  font-family: var(--hero-title-font) !important;
}

.elementor-8 .elementor-element.elementor-element-b1391ae .highlight,
.elementor-8 .elementor-element.elementor-element-b1391ae .highlight-underline {
  background-color: transparent !important;
  color: #2bdeff !important;
}

.elementor-8 .elementor-element.elementor-element-b1391ae .highlight-border {
  display: none !important;
}

.elementor-8 .elementor-element.elementor-element-b1391ae img {
  vertical-align: middle !important;
  display: inline-block !important;
  width: 0.85em !important;
  filter: drop-shadow(0 0 8px rgba(0, 209, 247, 0.6)) !important;
}

/* --------------------------------------------------------------------------
   2. Solutions (Offer) Page Hero Title Integration
   -------------------------------------------------------------------------- */
.elementor-6 .elementor-element.elementor-element-badb704 {
  width: 100% !important;
  max-width: 100% !important;
  left: 0 !important;
  right: 0 !important;
  margin: 0 auto !important;
  box-sizing: border-box !important;
  background-color: #242423 !important;
  background-image: 
    radial-gradient(ellipse 70% 50% at 50% 25%, rgba(0, 209, 247, 0.16) 0%, rgba(36, 36, 35, 0) 70%),
    linear-gradient(180deg, #1b1b1a 0%, #242423 100%) !important;
  padding: 185px 20px 140px 20px !important;
  min-height: 580px !important;
  position: relative !important;
}

.elementor-6 .elementor-element.elementor-element-badb704 > .elementor-container {
  max-width: 1240px !important;
  margin: 0 auto !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
}

.elementor-6 .elementor-element.elementor-element-b548506 > .elementor-widget-wrap {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  align-content: center !important;
  flex-wrap: nowrap !important;
  width: 100% !important;
}

.elementor-6 .elementor-element.elementor-element-dae9dfc {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 6px 18px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  color: var(--hero-badge-color) !important;
  background: var(--hero-badge-bg) !important;
  border: 1px solid var(--hero-badge-border) !important;
  border-radius: 999px !important;
  margin: 0 auto 22px auto !important;
  align-self: center !important;
  box-shadow: 0 0 16px rgba(0, 209, 247, 0.12) !important;
  width: auto !important;
  max-width: fit-content !important;
  height: auto !important;
}

.elementor-6 .elementor-element.elementor-element-dae9dfc .elementor-heading-title {
  color: var(--hero-badge-color) !important;
  font-family: "DM Sans", sans-serif !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.elementor-6 .elementor-element.elementor-element-dae9dfc .elementor-heading-title::before {
  content: "" !important;
  display: inline-block !important;
  width: 6px !important;
  height: 6px !important;
  border-radius: 50% !important;
  background-color: var(--hero-badge-color) !important;
  box-shadow: 0 0 8px var(--hero-badge-color) !important;
  flex-shrink: 0 !important;
}

.elementor-6 .elementor-element.elementor-element-ebc3e32,
.elementor-6 .elementor-element.elementor-element-ebc3e32 p {
  font-family: var(--hero-title-font) !important;
  font-size: clamp(38px, 5.5vw, 64px) !important;
  font-weight: 600 !important;
  color: var(--hero-text-white) !important;
  line-height: 1.15 !important;
  width: 100% !important;
  max-width: 960px !important;
  margin: 0 auto !important;
  margin-left: auto !important;
  margin-right: auto !important;
  align-self: center !important;
  letter-spacing: -0.5px !important;
  text-align: center !important;
}

.elementor-6 .elementor-element.elementor-element-ebc3e32 .elementor-widget-container {
  width: 100% !important;
  text-align: center !important;
}

.elementor-6 .elementor-element.elementor-element-ebc3e32 i {
  font-style: italic !important;
  font-family: var(--hero-title-font) !important;
}

/* --------------------------------------------------------------------------
   3. Contact Us Page Hero Title Integration
   -------------------------------------------------------------------------- */
.elementor-10 .elementor-element.elementor-element-1e6e030 {
  width: 100% !important;
  max-width: 100% !important;
  left: 0 !important;
  right: 0 !important;
  margin: 0 auto !important;
  box-sizing: border-box !important;
  background-color: #242423 !important;
  background-image: 
    radial-gradient(ellipse 70% 50% at 50% 25%, rgba(0, 209, 247, 0.16) 0%, rgba(36, 36, 35, 0) 70%),
    linear-gradient(180deg, #1b1b1a 0%, #242423 100%) !important;
  padding: 185px 20px 80px 20px !important;
  position: relative !important;
}

.elementor-10 .elementor-element.elementor-element-1e6e030 > .elementor-container {
  max-width: 1240px !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
}

.elementor-10 .elementor-element.elementor-element-128959b,
.elementor-10 .elementor-element.elementor-element-128959b > .elementor-widget-wrap {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Contact Us Hero Title Section */
.elementor-10 .elementor-element.elementor-element-0d89730 {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto 50px auto !important;
  padding: 0 !important;
}

.elementor-10 .elementor-element.elementor-element-0d89730 > .elementor-container,
.elementor-10 .elementor-element.elementor-element-2c9fc57,
.elementor-10 .elementor-element.elementor-element-2c9fc57 > .elementor-widget-wrap {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
}

.elementor-10 .elementor-element.elementor-element-723d457 {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 6px 18px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  color: var(--hero-badge-color) !important;
  background: var(--hero-badge-bg) !important;
  border: 1px solid var(--hero-badge-border) !important;
  border-radius: 999px !important;
  margin: 0 auto 22px auto !important;
  align-self: center !important;
  box-shadow: 0 0 16px rgba(0, 209, 247, 0.12) !important;
  width: auto !important;
  max-width: fit-content !important;
  height: auto !important;
}

.elementor-10 .elementor-element.elementor-element-723d457 .elementor-heading-title {
  color: var(--hero-badge-color) !important;
  font-family: "DM Sans", sans-serif !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.elementor-10 .elementor-element.elementor-element-723d457 .elementor-heading-title::before {
  content: "" !important;
  display: inline-block !important;
  width: 6px !important;
  height: 6px !important;
  border-radius: 50% !important;
  background-color: var(--hero-badge-color) !important;
  box-shadow: 0 0 8px var(--hero-badge-color) !important;
  flex-shrink: 0 !important;
}

.elementor-10 .elementor-element.elementor-element-a983e5a {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto 36px auto !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  text-align: center !important;
}

.elementor-10 .elementor-element.elementor-element-a983e5a p {
  width: 100% !important;
  max-width: 960px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  text-align: center !important;
  font-family: var(--hero-title-font) !important;
  font-size: clamp(38px, 5.5vw, 64px) !important;
  font-weight: 600 !important;
  color: var(--hero-text-white) !important;
  line-height: 1.15 !important;
  letter-spacing: -0.5px !important;
}

.elementor-10 .elementor-element.elementor-element-a983e5a i {
  font-style: italic !important;
  font-family: var(--hero-title-font) !important;
}

/* Contact Us Pill Cards Section */
.elementor-10 .elementor-element.elementor-element-13ad3e3 {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto 40px auto !important;
  padding: 0 !important;
}

.elementor-10 .elementor-element.elementor-element-13ad3e3 > .elementor-container,
.elementor-10 .elementor-element.elementor-element-5ce7acc,
.elementor-10 .elementor-element.elementor-element-5ce7acc > .elementor-widget-wrap {
  width: 100% !important;
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: stretch !important;
  gap: 24px !important;
}

.elementor-10 .elementor-element.elementor-element-f0b31bb,
.elementor-10 .elementor-element.elementor-element-e71283e,
.elementor-10 .elementor-element.elementor-element-98feaf4 {
  margin: 0 !important;
}

/* Contact Us Social Row */
.contact-social-row {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
  width: 100% !important;
  max-width: 1200px !important;
  margin: 32px auto 20px auto !important;
  padding: 0 !important;
  text-align: center !important;
}

.contact-social-label {
  font-family: 'DM Sans', sans-serif !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  color: rgba(207, 219, 213, 0.7) !important;
  letter-spacing: 2.5px !important;
  text-transform: uppercase !important;
  margin: 0 !important;
  text-align: center !important;
}

.contact-social-buttons {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
  width: 100% !important;
  margin: 0 auto !important;
}

/* --------------------------------------------------------------------------
   4. Blog Article Header Badge Enhancement
   -------------------------------------------------------------------------- */
.post-header .blog-badge {
  margin: 12px 0 16px 0 !important;
}

/* Mobile responsive adjustments */
@media (max-width: 767px) {
  .elementor-8 .elementor-element.elementor-element-bd30e65,
  .elementor-6 .elementor-element.elementor-element-badb704,
  .elementor-10 .elementor-element.elementor-element-1e6e030 {
    padding: 140px 16px 80px 16px !important;
    min-height: auto !important;
  }
}

/* Contact Page Canvas Background Unification */
html:has(body.page-id-10),
body.page-id-10,
body.page-id-10 #Wrapper {
  background-color: #242423 !important;
}