/* Import Lato Font */
@import url('https://fonts.googleapis.com/css2?family=Lato:wght@400;700&display=swap');

/* Global Background & Text Colors */
body {
  background-color: #111729 !important;
  font-family: 'Lato', sans-serif;
  color: #c3ccd4;
}

/* Headings (consistent color and spacing) */
h1, h2, h3, h4, h5, h6 {
  font-family: 'Lato', sans-serif;
  font-weight: 700;
  color: #ffffff !important;
  margin-bottom: 20px;
}

/* Paragraphs, spans, links & lists */
p, span, li {
  font-weight: 400;
  color: #b0bec5;
  font-size: 16px;
  line-height: 1.6;
}

/* Navigation Styling */
.main-navigation, .main-navigation a {
  font-family: 'Lato', sans-serif !important;
  background-color: #333333 !important;
  color: #ffffff !important;
}

.main-navigation ul.sub-menu {
  background-color: #333333 !important;
  width: 250px !important;
}

.main-navigation ul.sub-menu li a {
  font-size: 14px !important;
  white-space: nowrap !important;
  padding: 10px 15px !important;
}

.main-navigation a:hover,
.main-navigation ul.sub-menu li a:hover {
  background-color: #444444 !important;
}

/* WPBakery Text Elements */
.wpb_text_column {
  color: inherit;
}

.wpb_text_column h1, 
.wpb_text_column h2, 
.wpb_text_column h3, 
.wpb_text_column h4, 
.wpb_text_column h5 {
  color: #ffffff !important;
}

/* Rounded Corners for WPBakery Images */
.wpb_single_image img {
  border-top-left-radius: 15px !important;
  border-top-right-radius: 15px !important;
  width: 100%;
  height: auto;
}

/* Checklist Bullet Style */
ul.checklist {
  list-style: none;
  padding-left: 0;
}

ul.checklist li {
  position: relative;
  padding-left: 1.8rem;
  margin-bottom: 0.75rem;
  color: #c3ccd4;
  line-height: 1.6;
}

ul.checklist li::before {
  content: "✔";
  position: absolute;
  left: 0;
  top: 0.15rem;
  background-color: #b466f6;
  color: white;
  border-radius: 50%;
  font-size: 0.6rem;
  line-height: 1.2rem;
  width: 1.2rem;
  height: 1.2rem;
  text-align: center;
  font-weight: bold;
}

/* Button Styling for WPBakery */
.vc_btn3-container, .vc_btn3-container .vc_general.vc_btn3 {
  width: 100% !important;
  display: block !important;
  text-align: center !important;
  padding-left: 30px !important;
  padding-right: 30px !important;
}

/* Background Gradients */
.bk-dark-grad {
  background-image: linear-gradient(45deg, #030D1A, #0F2847);
  color: #fff;
}

.footer {
  background-image: linear-gradient(160deg, #000000, #44546A);
}

/* Utility Classes */
.white-text, .white-label .gform_required_legend, .white-label .gfield_label {
  color: white;
}

legend {
  color: #264061;
}

.footer-divider .cls-1 {
  fill: #111729 !important;
}

.demo-title {
  margin-bottom: 25px;
}

.fancybar {
  display: none !important;
}

/* Hero Image 
.hero-image {
  background-size: cover !important;
  background-position: right center !important;
  background-repeat: no-repeat !important;
  display: flex;
  align-items: center;
}*/

.hero-image-enh {
  background-image: url('https://norwoodsystems.com/wp-content/uploads/2025/04/AIEngagementHeroImage4.png') !important;
  background-size: cover !important;
  background-position: right center !important;
  background-repeat: no-repeat !important;

  position: relative !important;
  left: 50% !important;
  width: 100vw !important;
  margin-left: -50vw !important;
  max-width: none !important;
  
  min-height: 500px; /* Set desired height */
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding-left: 3rem;
  box-sizing: border-box !important;
  overflow: hidden !important;
}

.hero-image-auto {
  background-image: url('https://norwoodsystems.com/wp-content/uploads/2025/04/AIAutomationHeroImage4.png') !important;
  background-size: cover !important;
  background-position: right center !important;
  background-repeat: no-repeat !important;

  position: relative !important;
  left: 50% !important;
  width: 100vw !important;
  margin-left: -50vw !important;
  max-width: none !important;
  
  min-height: 800px; /* Set desired height */
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding-left: 3rem;
  box-sizing: border-box !important;
  overflow: hidden !important;
}

@media screen and (max-width: 991px) {
  .vc_column_container.vc_col-sm-6 {
    width: 100% !important;      /* ← This forces column to stack */
    max-width: 100% !important;
  }
}

h4.demo-title {
  margin-top: 2.0rem;
}

.flex-card .wpb_wrapper {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.flex-card .wpb_wrapper > *:last-child {
  margin-top: auto;
}


.footer-divider svg {
    width: 100%;
    height: auto; /* Maintains the aspect ratio */
    display: block; /* Prevents any unwanted inline spacing */
}

/* Explicitly remove padding and margins that cause misalignment */
.footer-menu.container-fluid {
  padding-left: 10%;
  padding-right: 0%;
}

/* Explicitly remove padding and margins that cause misalignment */
.bottom-menu.container-fluid {
	width:flex;
  padding-left: 0%;
  padding-right: 10%;
}

.bottom-menu.container-fluid .row {
  display: flex !important;
  align-items: left !important;
}

/* ensure correct width calculations */
.col-footer-6 {
  flex: 0 0 50%; /* exactly 6/12 */
  max-width: 50%;
}

.col-footer-4 {
  flex: 0 0 33.333%; /* exactly 4/12 */
  max-width: 33.333%;
}

.col-footer-2 {
  flex: 0 0 16.667%; /* exactly 2/12 */
  max-width: 16.667;
}

.bottom-menu.container-fluid .row {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between; /* this ensures even distribution across the container */
  align-items: center; 
  margin: 0;
}


.bottom-menu.container-fluid {
  max-width: none !important; /* this forces removal of any constraint */
  width: 100% !important; /* ensures full width is explicitly set */
  padding-left: 0% !important; /* symmetric padding matching top footer */
  padding-right: 0% !important;
}

.bottom-menu.container-fluid .row {
  display: flex;
  justify-content: space-between;
  align-items: center; 
  margin: 0 !important;
}

.footer-row-no-margin {
  margin-left: 0 !important;
  margin-right: 0 !important;
  max-width: none !important; /* removes any implicit max-width constraints */
  width: 100% !important;
  display: flex !important;
  justify-content: space-between !important;
}

/* 1) Give .bottom-menu full width, remove constraints, add modest left/right padding */
.bottom-menu.container-fluid {
  max-width: none !important; /* override theme's max-width */
  width: 100% !important;
  padding-left: 10% !important;  /* adjust to taste */
  padding-right: 12% !important; /* adjust to taste */
  margin: 0 auto; /* center horizontally, if needed */
}

/* 2) Make the row a flex container with no negative margins */
.bottom-menu.container-fluid .row.footer-row-no-margin {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
  margin: 0 !important; /* no extra row margin */
}
/* 4) Align textual content in each area */
.bottom-menu .ftr-1 { text-align: left; }
.bottom-menu .ftr-2 { text-align: left; }
.bottom-menu .ftr-3 { text-align: right; }

/* This class will remove the image corner rounding */
.no-rounded img {
  border-top-left-radius: 10px !important;
  border-top-right-radius:  10px !important;
	  border-bottom-left-radius: 10px !important;
  border-bottom-right-radius:  10px !important;
}

.norwood-highlight {
  /* Layout & shape */
  display: block;          /* ensures full‑width inside VC rows */
  padding: 1.25rem 1.5rem; /* comfortable breathing room */
  margin: 1.5rem 0;        /* vertical spacing */
  border-radius: 8px;      /* “tight” rounded rectangle */

  /* Colouring – 2 shades lighter than #111729 */
  background-color: #1b2435;   /* tweak +10% lightness */
  color: #ffffff;              /* pure white text */

  /* Typography */
  font-family: 'Lato', sans-serif;
  font-size: 2rem;      /* ~18–19 px on standard root 16 px */
  font-style: italic;
  font-weight: 500;        /* “Roman italic” – midway weight */
  line-height: 1.7;
  text-align: center;      /* keeps short quotes tidy */

  /* Optional subtle glow for emphasis */
  box-shadow: 0 0 6px rgba(255, 255, 255, 0.05);
}

/* Dark‑mode or very low‑contrast screens */
@media (prefers-color-scheme: dark) {
  .norwood-highlight {
    background-color: #262f41; /* lift a further shade for clarity */
  }
}

/* === GENERAL UTILITIES =============================================== */
.container-narrow { max-width: 840px; margin: 0 auto; padding: 0 1rem; }
.blog-hero      { position: relative; min-height: 52vh; background-size:cover; background-position:center; }
.hero-overlay   { width:100%; background:linear-gradient(to top,rgba(17,23,41,.9)0%,rgba(17,23,41,.2)80%,transparent); padding:4rem 1.5rem 3rem; color:#fff; font-family:'Lato',sans-serif; }
.hero-dek       { font-size:1.25rem; max-width:40rem; line-height:1.5; opacity:.9; }
.section-title  { font-family:'Lato',sans-serif; font-weight:700; color:#fff; margin:3rem 0 1.25rem; position:relative; padding-left:1rem; }
.section-title::before { content:''; position:absolute; left:0; top:.35em; width:6px; height:.9em; background:#00a1ff; border-radius:3px; }
.revenue-title  { margin:2.25rem 0 0.75rem; font-weight:600; color:#fff; }
.dropcap::first-letter { font-size:3.5rem; font-weight:700; float:left; line-height:.8; padding-right:0.15em; color:#00a1ff; }
.hero-quote     { margin:2.5rem 0; padding:1.25rem 1.75rem; background:#1b2435; border-left:4px solid #00a1ff; font-style:italic; font-size:1.25rem; color:#fff; }

/* Highlight box (from previous step) */
.norwood-highlight { display:block; padding:1.25rem 1.5rem; margin:2rem auto; border-radius:8px; background:#1b2435; color:#fff; font-family:'Lato',sans-serif; font-style:italic; text-align:center; }

/* Author sign‑off */
.author-signoff { text-align:right; font-style:italic; color:#b0bec5; }

/* === FADE‑IN ANIMATION =============================================== */
.fade-in-up { opacity:0; transform:translateY(24px); transition:opacity .8s ease,transform .8s ease; }
.fade-in-up.is-visible { opacity:1; transform:translateY(0); }

/* Optional responsive tweaks */
@media(max-width:600px){ .blog-hero{min-height:62vh;} .hero-overlay{padding:3rem 1rem 2rem;} }

/* ----------------------------------------------------------
   Global inline‑text links
   ---------------------------------------------------------- */

/* Base state – 80 % white on dark background */
body a:not(.vc_general):not(.vc_btn3),
body .wpb_text_column a:not(.vc_general):not(.vc_btn3) {
  color: rgba(255, 255, 255, 0.8) !important;
  text-decoration: none;
}

/* Hover / focus – full white + underline for affordance */
body a:not(.vc_general):not(.vc_btn3):hover,
body .wpb_text_column a:not(.vc_general):not(.vc_btn3):hover,
body a:not(.vc_general):not(.vc_btn3):focus,
body .wpb_text_column a:not(.vc_general):not(.vc_btn3):focus {
  color: #ffffff !important;
  text-decoration: underline;
}


/* Force dark menu background on tablet & phone */
@media (max-width: 991px) {

  /* Most themes use one of these selectors – keep all to be safe */
  .mobile-nav,
  .mobile-menu,
  .menu-toggle,
  .off-canvas-menu,
  .ast-mobile-header-wrap,
  .main-navigation,
  .main-navigation ul,
  .site-header,
  header .elementor-nav-menu--dropdown {

    background-color: #333333 !important;   /* same as desktop */
    color: #ffffff !important;              /* ensures links stay white */
  }

  /* Optional: make mobile dropdown items inherit your link colour */
  .mobile-nav a,
  .mobile-menu a,
  .elementor-nav-menu--dropdown a {
    color: #ffffff !important;
  }
}

/* ---- Max Mega Menu – force dark bar & dropdown on tablet / phone ---- */
@media (max-width: 991px) {

  /* The bar that holds the hamburger */
  .mega-menu-wrap,
  .mega-menu-toggle,
  .mega-toggle-blocks-left,
  .mega-toggle-blocks-centre,
  .mega-toggle-blocks-right,

  /* The dropdown panel itself */
  .mega-menu.mega-menu-horizontal,
  .mega-menu.mega-menu-vertical {

     color: #ffffff !important;
  }

  /* Links inside the dropdown */
  .mega-menu.mega-menu-horizontal a,
  .mega-menu.mega-menu-vertical a {
    color: #ffffff !important;
  }
}

/* ----- Max Mega Menu – mobile item states ----- */
@media (max-width: 991px) {

  /* Default link rows */
  .mega-menu a.mega-menu-link,
  .mega-menu a.mega-menu-link:link,
  .mega-menu a.mega-menu-link:visited {
      background: #111729 !important;   /* dark like page bg */
      color: #ffffff !important;
  }

  /* Hover / focus / current page highlight */
  .mega-menu a.mega-menu-link:hover,
  .mega-menu-item:hover > a.mega-menu-link,
  .mega-menu-item.mega-current-menu-item > a.mega-menu-link,
  .mega-menu-item.mega-current-menu-ancestor > a.mega-menu-link {
      color: #ffffff !important;
  }
}

/* === Max Mega Menu – mobile hamburger / close icon colour = white bars === */
@media (max-width: 991px) {

  /* 1️⃣  Keep the toggle background the same dark shade as your header */
  .mega-menu-wrap,
  .mega-menu-toggle {
!important;   /* match header/nav bar */
  }

  /* 2️⃣  Make sure the wrapper itself is transparent so only bars show */
  .mega-menu-toggle .mega-toggle-block {
      background: transparent !important;
  }

  /* 3️⃣  Re-colour the bars (pseudo-elements) */
  .mega-menu-toggle .mega-toggle-block,
  .mega-menu-toggle .mega-toggle-block:before,
  .mega-menu-toggle .mega-toggle-block:after,
  .mega-menu-toggle:before,
  .mega-menu-toggle:after {
      border-color: #ffffff !important;   /* white bars/X lines */
  }

  /* 4️⃣  If your theme swaps to an SVG icon, recolour its path */
  .mega-menu-toggle svg path {
      stroke: #ffffff !important;
      fill:   #ffffff !important;
  }
}