/* =====================================================
   HERO / BANNER SECTION — Background color update
   "From The Classrooms Of Italy To Careers Across Europe"
   Old color: Dark Green/Teal (#173F3A approx)
   New color: Logo Blue (#1B4B91)
   =====================================================

   IMPORTANT: I don't have your actual HTML for this section,
   so I've listed the most common class/selector names below.
   Only ONE of these will match your real code — the rest will
   simply do nothing (they won't break anything).

   HOW TO FIND THE CORRECT ONE (30 seconds):
   1. Open your website in Chrome
   2. Right-click on the dark green hero background -> "Inspect"
   3. In the Elements panel, look at the <section> or <div> tag
      that wraps the whole hero area (heading + paragraph + search bar)
   4. Copy its class name (e.g. class="hero-banner")
   5. Send me that class name, OR replace ".hero-section" below
      with your real class name (keep the dot).
   ===================================================== */

:root {
    --latasia-accent-blue: #1B4B91;
}

/* Try #1 - most common naming */
.hero-section,
.hero-banner,
.tf-hero,
.tf-hero-section,
.banner-section,
.home-hero {
    background-color: var(--latasia-accent-blue) !important;
    background-image: none !important; /* removes the dotted world-map image if it's a separate bg-image layer */
}

/* If the world map dotted pattern is a background-image (not just color),
   and you want to KEEP the dotted map pattern but just change the color
   underneath it, delete the "background-image: none" line above and
   use this instead: */

/*
.hero-section {
    background-color: var(--latasia-accent-blue) !important;
}
*/