.elementor-13312 .elementor-element.elementor-element-b180393{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;}.elementor-13312 .elementor-element.elementor-element-b180393 > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}/* Start custom CSS for html, class: .elementor-element-0fdc939 */.hero-section{
    background:transparent;
    border-radius:20px;
    padding:0px;
    box-shadow:0 3px 10px rgba(0,0,0,.10);
}

.hero-tag{
    display:inline-block;
    padding:10px 20px;
    border-radius:25px;
    background:#dbeafe;
    color:#1d4ed8;
    margin-bottom:10px;
}

.hero-title{
    font-size:45px;
    line-height:1;
    font-weight:700;
    color:#123f7a;
    margin:0 0 20px 0;
}

.hero-text{
    font-size:20px;
    color:#555;
    margin-bottom:25px;
}

.hero-button{
    display:inline-block;
    background:#0d6efd;
    color:#fff !important;
    text-decoration:none;
    padding:14px 28px;
    border-radius:8px;
    font-weight:600;
}

.hero-image{
    max-width:100%;
    border-radius:15px;
}

.elementor-13312 .elementor-element.elementor-element-0fdc939{
    background: linear-gradient(
        135deg,
        #ffffff 0%,
        #f4f7fb 50%,
        #eef3f9 100%
    );

    border-radius:20px;
    padding:40px;
}



.elementor-13312 .elementor-element.elementor-element-0fdc939{
    background-image:url("https://dknowledgehub.com/wp-content/uploads/2026/07/Welcome-to-Leadership-Training-5.png");
    background-repeat:no-repeat;
    background-position:right center;
    background-size:cover;

    min-height:550px;
    padding:60px;
    border-radius:20px;
}


@media (max-width: 768px){

    .elementor-13312 .elementor-element.elementor-element-0fdc939{
        background-position:center bottom;
        background-size:contain;
        min-height:500px;
        padding:30px;
    }

    .hero-title{
        font-size:32px;
        max-width:100%;
    }

    .hero-text{
        font-size:18px;
        max-width:100%;
    }
}


/* Keeps the wrapper on the same line as the text */
.dropdown {
  position: relative;
  display: inline-block;
  margin-left: 5px; /* Adds space after your text */
}

/* Style your button */
.dropbtn {
 
background-color: #28a745 !important;
  color: white;
  padding: 6px 1px !important;
  font-size: 14px !important;
  border: none !important;
  border-radius: 6px;
  cursor: pointer;
}


/* Hide content and position it underneath the text line */
.dropdown-content {
  display: none;
  position: absolute;
  left: 0;
  top: 100%;
  background-color: #ffffff;
  min-width: 120px;
  box-shadow: 0px 4px 8px rgba(0,0,0,0.15);
  border: 1px solid #ccc;
  z-index: 10;
}

/* Style the links */
.dropdown-content a {
  color: #333;
  padding: 8px 12px;
  text-decoration: none;
  display: block;
}

.dropdown-content a:hover {
  background-color: #f1f1f1;
}

/* Show on hover */
.dropdown:hover .dropdown-content {
  display: block;
}





/* Container to keep buttons aligned side-by-side */
.hero-buttons {
  display: flex;
  align-items: center;
  gap: 16px; /* Spacing between the two buttons */
  margin-top: 20px;
}

/* Base button styles shared by both elements */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 8px; /* Space between icon and text */
  padding: 12px 24px;
  font-size: 15px;
  font-weight: 500;
  text-decoration: none;
  border-radius: 6px;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
}

/* 1. Green "Start Learning" Button Styling */
.btn-primary {
  background-color: #00a651; /* NHIS Platform Green */
  color: #ffffff;
  border: 1px solid #00a651;
}

.btn-primary:hover {
  background-color: #008740; /* Darker green on hover */
  border-color: #008740;
}

/* 2. Transparent "View Courses" Button Styling */
.btn-secondary {
  background-color: transparent;
  color: #ffffff;
  border: 1px solid #ffffff; /* White outline border */
}

.btn-secondary:hover {
  background-color: rgba(255, 255, 255, 0.1); /* Subtle white glow on hover */
}




/* Container keeping buttons side-by-side */
.hero-buttons {
  display: flex;
  align-items: center;
  gap: 16px; 
  margin-top: 20px;
}

/* Base button styles */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 24px;
  font-size: 15px;
  font-weight: 500;
  text-decoration: none;
  border-radius: 6px;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
  font-family: inherit;
}

/* Green "Start Learning" Button Styling */
.btn-primary {
  background-color: #00a651; /* NHIS Platform Green */
  color: #ffffff;
  border: 1px solid #00a651;
}
.btn-primary:hover {
  background-color: #008740;
  border-color: #008740;
}

/* Dropdown Positioning Parent Wrapper */
.dropdown-wrapper {
  position: relative;
  display: inline-block;
}

/* Transparent "View Courses" Button Styling */
.btn-secondary {
  background-color: transparent;
  color: #ffffff;
  border: 1px solid #ffffff;
}
.dropdown-wrapper:hover .btn-secondary {
  background-color: rgba(255, 255, 255, 0.1);
}

/* Hidden Dropdown Options Menu Box */
.dropdown-menu {
  display: none;
  position: absolute;
  top: 110%; /* Sits slightly below the button */
  left: 0;
  background-color: #ffffff;
  min-width: 140px;
  box-shadow: 0px 8px 24px rgba(0,0,0,0.15);
  border-radius: 6px;
  z-index: 100;
  overflow: hidden;
}

/* Individual Links Inside Menu Box */
.dropdown-menu a {
  color: #333333;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  font-size: 14px;
  text-align: left;
  transition: background-color 0.15s ease;
}
.dropdown-menu a:hover {
  background-color: #f5f5f5;
}

/* Optional styling for a call-to-action bottom link */
.dropdown-menu a.see-all {
  border-top: 1px solid #eeeeee;
  color: #00a651;
  font-weight: bold;
}

/* Triggers the layout to open on hover */
.dropdown-wrapper:hover .dropdown-menu {
  display: block;
}/* End custom CSS */
/* Start custom CSS for section, class: .elementor-element-b180393 */.course-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin:30px 0;
}/* End custom CSS */