.elementor-330 .elementor-element.elementor-element-54768fda{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--align-items:stretch;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:0%;--padding-bottom:0%;--padding-left:8%;--padding-right:0%;--z-index:0;}.elementor-330 .elementor-element.elementor-element-d59c229{width:100%;max-width:100%;}.elementor-330 .elementor-element.elementor-element-c712425{--display:flex;}.elementor-330 .elementor-element.elementor-element-112d13c{width:100%;max-width:100%;}.elementor-330 .elementor-element.elementor-element-52ab571{--display:flex;}.elementor-330 .elementor-element.elementor-element-26dac67{width:100%;max-width:100%;transition:background 0.1s;}.elementor-330 .elementor-element.elementor-element-26dac67.elementor-element{--align-self:flex-start;}@media(max-width:1024px){.elementor-330 .elementor-element.elementor-element-54768fda{--gap:60px 0px;--row-gap:60px;--column-gap:0px;--flex-wrap:wrap;--padding-top:0%;--padding-bottom:0%;--padding-left:5%;--padding-right:5%;}}/* Start custom CSS for shortcode, class: .elementor-element-26dac67 *//* ==========================================
   OPEN INTERNATIONAL COLLEGE
   PREMIUM FEATURED COURSES DESIGN
   ========================================== */

.oic-featured-courses {
  --oic-navy: #0C2B48;
  --oic-gold: #C6A052;
  --oic-ice: #FAFCFF;

  position: relative;
  isolation: isolate;
  overflow: hidden;

  background:
    radial-gradient(
      ellipse at 90% 0%,
      rgba(198,160,82,.11),
      transparent 35%
    ),
    radial-gradient(
      ellipse at 5% 95%,
      rgba(12,43,72,.08),
      transparent 40%
    ),
    linear-gradient(
      180deg,
      #FAFCFF 0%,
      #EDF3F9 100%
    );

  padding: 85px 24px 95px;
}

/* Subtle academic decorative lines */

.oic-featured-courses::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;

  background-image:
    linear-gradient(
      rgba(12,43,72,.025) 1px,
      transparent 1px
    ),
    linear-gradient(
      90deg,
      rgba(12,43,72,.025) 1px,
      transparent 1px
    );

  background-size: 46px 46px;
}

/* Main headings */

.oic-featured-courses h2 {
  color: #0C2B48;
  font-family: "Playfair Display", Georgia, serif;
  font-size: clamp(29px, 3vw, 42px);
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
}

/* Supporting text */

.oic-featured-courses
.elementor-widget-text-editor {
  color: #61758A;
}

/* Tutor LMS course cards */

.oic-featured-courses
.tutor-course-card {
  background: #FFFFFF;
  border: 1px solid #DFE7F0;
  border-radius: 16px;
  overflow: hidden;

  box-shadow:
    0 7px 22px rgba(12,43,72,.07);

  transition:
    transform .3s ease,
    box-shadow .3s ease,
    border-color .3s ease;

  height: 100%;
}

/* Hover effect */

.oic-featured-courses
.tutor-course-card:hover {
  transform: translateY(-7px);
  border-color: rgba(198,160,82,.55);

  box-shadow:
    0 18px 38px rgba(12,43,72,.14);
}

/* Course thumbnail */

.oic-featured-courses
.tutor-course-card
.tutor-course-thumbnail {
  overflow: hidden;
}

.oic-featured-courses
.tutor-course-card
.tutor-course-thumbnail img {
  width: 100%;
  object-fit: cover;
  transition: transform .4s ease;
}

.oic-featured-courses
.tutor-course-card:hover
.tutor-course-thumbnail img {
  transform: scale(1.04);
}

/* Course titles */

.oic-featured-courses
.tutor-course-card
.tutor-course-name a {
  color: #0C2B48;
  font-weight: 700;
  line-height: 1.45;
}

.oic-featured-courses
.tutor-course-card
.tutor-course-name a:hover {
  color: #A57B32;
}

/* Course action buttons */

.oic-featured-courses
.tutor-course-card .tutor-btn {
  border-radius: 8px;
  font-weight: 600;
  transition: all .25s ease;
}

/* Primary buttons */

.oic-featured-courses
.tutor-course-card .tutor-btn-primary {
  background: #0C2B48;
  border-color: #0C2B48;
  color: #FFFFFF;
}

.oic-featured-courses
.tutor-course-card .tutor-btn-primary:hover {
  background: #C6A052;
  border-color: #C6A052;
  color: #0C2B48;
}

/* ==========================================
   COURSE METADATA CUSTOMIZATION
   Remove Enrolled count and icon
   ========================================== */

/* Hide first metadata item: 0 Enrolled */

.oic-featured-courses
.td_card_meta > li:first-child {
  display: none !important;
}

/* Keep the remaining metadata aligned */

.oic-featured-courses
.td_card_meta {
  display: flex;
  align-items: center;
  gap: 10px;
}

/* Remove divider or border after hiding
   the enrolment item */

.oic-featured-courses
.td_card_meta > li:nth-child(2) {
  border-left: none !important;
  padding-left: 0 !important;
  margin-left: 0 !important;
}

/* ==========================================
   RESPONSIVE SPACING
   ========================================== */

@media (max-width: 1024px) {
  .oic-featured-courses {
    padding: 65px 22px 75px;
  }
}

@media (max-width: 767px) {
  .oic-featured-courses {
    padding: 48px 15px 60px;
  }

  .oic-featured-courses h2 {
    font-size: 29px;
  }

  .oic-featured-courses
  .tutor-course-card {
    border-radius: 13px;
  }
}

/* Accessibility */

@media (prefers-reduced-motion: reduce) {
  .oic-featured-courses
  .tutor-course-card,
  .oic-featured-courses
  .tutor-course-card img {
    transition: none;
  }
}

/* OPEN INTERNATIONAL COLLEGE */

/* Remove Enrolled and its icon */
.td_card_meta > li:first-child {
    display: none !important;
}

/* Keep automatic numbers and text visible */
.td_card_meta > li:nth-child(2) .td_opacity_7 {
    font-size: 18px !important;
    color: #0C2B48;
}

/* Remove unnecessary spacing */
.td_card_meta > li:nth-child(2) {
    border-left: none !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-52ab571 *//* =====================================================
   OPEN INTERNATIONAL COLLEGE
   FEATURED ACADEMIC COURSES
   PREMIUM MIDNIGHT NAVY & ACADEMIC GOLD

   Desktop: 3 cards
   Tablet:  2 cards
   Mobile:  1 card

   Elementor Parent Container → Custom CSS
   ===================================================== */


/* ==========================================
   1. MAIN SECTION
   ========================================== */

.elementor-330 .elementor-element.elementor-element-52ab571 {
    --oic-navy: #071E35;
    --oic-blue: #0C2B48;
    --oic-gold: #D7AB55;

    position: relative;
    isolation: isolate;

    background-color: #071E35 !important;
    background-image: none !important;

    border-top: 3px solid #D7AB55;

    padding: 65px 28px 75px !important;
    overflow: hidden;
}

.elementor-330 .elementor-element.elementor-element-52ab571 > .e-con-inner,
.elementor-330 .elementor-element.elementor-element-52ab571 > .elementor-container {
    position: relative;
    z-index: 1;
}


/* ==========================================
   2. SECTION HEADING
   ========================================== */

.elementor-330 .elementor-element.elementor-element-52ab571 .elementor-widget-heading
.elementor-heading-title {
    color: #FFFFFF !important;
    font-family: "Playfair Display", Georgia, serif;
    font-weight: 700;
    line-height: 1.25;
}

/* Introductory text */

.elementor-330 .elementor-element.elementor-element-52ab571 .elementor-widget-text-editor p {
    color: #D7E0EA !important;
    line-height: 1.75;
}

/* Gold decorations */

.elementor-330 .elementor-element.elementor-element-52ab571 .elementor-divider-separator {
    border-color: #D7AB55 !important;
}

.elementor-330 .elementor-element.elementor-element-52ab571 .elementor-icon {
    color: #D7AB55;
}


/* ==========================================
   3. COURSE LISTING
   ========================================== */

.elementor-330 .elementor-element.elementor-element-52ab571 .tutor-course-list,
.elementor-330 .elementor-element.elementor-element-52ab571 .tutor-course-loop {
    width: 100%;
    max-width: 1160px;
    margin-left: auto;
    margin-right: auto;
}

.elementor-330 .elementor-element.elementor-element-52ab571 .tutor-course-list {
    display: grid !important;
    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;
    gap: 20px !important;
    align-items: stretch;
}

.elementor-330 .elementor-element.elementor-element-52ab571 .tutor-course-list > * {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    flex: none !important;
}


/* ==========================================
   4. PREMIUM WHITE COURSE CARDS
   ========================================== */

.elementor-330 .elementor-element.elementor-element-52ab571 .td_card,
.elementor-330 .elementor-element.elementor-element-52ab571 .tutor-course-card {
    min-width: 0 !important;

    background: #FFFFFF !important;

    border: 1px solid rgba(215,171,85,.38) !important;
    border-bottom: 3px solid #D7AB55 !important;

    border-radius: 10px !important;
    overflow: hidden !important;

    box-shadow: 0 10px 28px rgba(0,0,0,.20);

    transition:
        transform .3s ease,
        box-shadow .3s ease;
}

.elementor-330 .elementor-element.elementor-element-52ab571 .td_card:hover,
.elementor-330 .elementor-element.elementor-element-52ab571 .tutor-course-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 35px rgba(0,0,0,.30);
}


/* ==========================================
   5. CARD CONTENT
   ========================================== */

.elementor-330 .elementor-element.elementor-element-52ab571 .td_card_info_in,
.elementor-330 .elementor-element.elementor-element-52ab571 .tutor-course-card-body {
    min-width: 0 !important;
    padding: 13px 14px !important;
}


/* ==========================================
   6. HIDE COURSE DESCRIPTIONS
   ========================================== */

.elementor-330 .elementor-element.elementor-element-52ab571 .td_card_subtitle,
.elementor-330 .elementor-element.elementor-element-52ab571 .td_card_info_in .td_card_subtitle,
.elementor-330 .elementor-element.elementor-element-52ab571 p.td_card_subtitle,
.elementor-330 .elementor-element.elementor-element-52ab571 .tutor-course-description,
.elementor-330 .elementor-element.elementor-element-52ab571 .tutor-course-excerpt {
    display: none !important;
}


/* ==========================================
   7. DARK NAVY COURSE TITLES
   ========================================== */

.elementor-330 .elementor-element.elementor-element-52ab571 .td_card_info_in h2,
.elementor-330 .elementor-element.elementor-element-52ab571 .td_card_info_in h3,
.elementor-330 .elementor-element.elementor-element-52ab571 .td_card_info_in h4,
.elementor-330 .elementor-element.elementor-element-52ab571 .td_card_info_in h2 a,
.elementor-330 .elementor-element.elementor-element-52ab571 .td_card_info_in h3 a,
.elementor-330 .elementor-element.elementor-element-52ab571 .td_card_info_in h4 a,
.elementor-330 .elementor-element.elementor-element-52ab571 .tutor-course-card .tutor-course-name,
.elementor-330 .elementor-element.elementor-element-52ab571 .tutor-course-card .tutor-course-name a,
.elementor-330 .elementor-element.elementor-element-52ab571 .tutor-course-card .tutor-course-title a {
    font-family: "Montserrat", Arial, sans-serif !important;

    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
    letter-spacing: -0.2px;

    color: #0C2B48 !important;

    overflow-wrap: break-word !important;
    word-break: normal !important;

    margin-top: 0 !important;
    margin-bottom: 5px !important;
}

/* Maximum two title lines */

.elementor-330 .elementor-element.elementor-element-52ab571 .td_card_info_in h2,
.elementor-330 .elementor-element.elementor-element-52ab571 .td_card_info_in h3,
.elementor-330 .elementor-element.elementor-element-52ab571 .td_card_info_in h4,
.elementor-330 .elementor-element.elementor-element-52ab571 .tutor-course-card .tutor-course-name a,
.elementor-330 .elementor-element.elementor-element-52ab571 .tutor-course-card .tutor-course-title a {
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    overflow: hidden !important;
}

/* Academic gold hover */

.elementor-330 .elementor-element.elementor-element-52ab571 .td_card_info_in h2 a:hover,
.elementor-330 .elementor-element.elementor-element-52ab571 .td_card_info_in h3 a:hover,
.elementor-330 .elementor-element.elementor-element-52ab571 .td_card_info_in h4 a:hover,
.elementor-330 .elementor-element.elementor-element-52ab571 .tutor-course-card .tutor-course-name a:hover,
.elementor-330 .elementor-element.elementor-element-52ab571 .tutor-course-card .tutor-course-title a:hover {
    color: #B58A3D !important;
}


/* ==========================================
   8. ACADEMIC GOLD CATEGORY
   ========================================== */

.elementor-330 .elementor-element.elementor-element-52ab571 .td_card_info_in .td_card_cat,
.elementor-330 .elementor-element.elementor-element-52ab571 .tutor-course-card .tutor-course-category {
    color: #A57B32 !important;

    font-family: "Montserrat", Arial, sans-serif;

    font-size: 10px !important;
    font-weight: 700 !important;

    letter-spacing: .45px;
    text-transform: uppercase;
}


/* ==========================================
   9. GOLD STAR RATINGS
   ========================================== */

.elementor-330 .elementor-element.elementor-element-52ab571 .tutor-icon-star-bold,
.elementor-330 .elementor-element.elementor-element-52ab571 .tutor-icon-star-line,
.elementor-330 .elementor-element.elementor-element-52ab571 .td_card_info_in .td_review {
    color: #D7AB55 !important;
}


/* ==========================================
   10. COURSE BUTTONS
   ========================================== */

.elementor-330 .elementor-element.elementor-element-52ab571 .tutor-course-card .tutor-btn-primary {
    background: #0C2B48 !important;
    color: #FFFFFF !important;
    border-color: #0C2B48 !important;
    border-radius: 7px !important;
}

.elementor-330 .elementor-element.elementor-element-52ab571 .tutor-course-card .tutor-btn-primary:hover {
    background: #D7AB55 !important;
    color: #071E35 !important;
    border-color: #D7AB55 !important;
}


/* ==========================================
   11. COURSE SORTING DROPDOWN
   ========================================== */

.elementor-330 .elementor-element.elementor-element-52ab571 select {
    background: #FFFFFF !important;
    color: #0C2B48 !important;

    border: 1px solid #D7AB55 !important;
    border-radius: 8px !important;

    font-size: 13px !important;
}


/* ==========================================
   12. TABLET
   ========================================== */

@media (min-width: 768px) and (max-width: 1024px) {

    .elementor-330 .elementor-element.elementor-element-52ab571 {
        padding: 50px 20px 60px !important;
    }

    .elementor-330 .elementor-element.elementor-element-52ab571 .tutor-course-list {
        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;
        gap: 16px !important;
    }

    .elementor-330 .elementor-element.elementor-element-52ab571 .td_card_info_in h2,
    .elementor-330 .elementor-element.elementor-element-52ab571 .td_card_info_in h3,
    .elementor-330 .elementor-element.elementor-element-52ab571 .td_card_info_in h4,
    .elementor-330 .elementor-element.elementor-element-52ab571 .td_card_info_in h2 a,
    .elementor-330 .elementor-element.elementor-element-52ab571 .td_card_info_in h3 a,
    .elementor-330 .elementor-element.elementor-element-52ab571 .td_card_info_in h4 a {
        font-size: 14px !important;
    }

}


/* ==========================================
   13. MOBILE — ONE ELEGANT CARD PER ROW
   ========================================== */

@media (max-width: 767px) {

    .elementor-330 .elementor-element.elementor-element-52ab571 {
        padding: 40px 15px 55px !important;
    }

    /* Section heading */

    .elementor-330 .elementor-element.elementor-element-52ab571 .elementor-widget-heading
    .elementor-heading-title {
        font-size: 27px !important;
        line-height: 1.3 !important;
    }

    /* Single-column grid */

    .elementor-330 .elementor-element.elementor-element-52ab571 .tutor-course-list,
    .elementor-330 .elementor-element.elementor-element-52ab571 .tutor-course-loop {
        display: grid !important;

        grid-template-columns:
            minmax(0, 1fr) !important;

        gap: 18px !important;
        width: 100% !important;
    }

    /* Reset course column sizing */

    .elementor-330 .elementor-element.elementor-element-52ab571 .tutor-course-list > *,
    .elementor-330 .elementor-element.elementor-element-52ab571 .tutor-course-loop > * {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        grid-column: 1 / -1 !important;

        margin: 0 !important;
        padding: 0 !important;
    }

    /* Centre cards */

    .elementor-330 .elementor-element.elementor-element-52ab571 .td_card,
    .elementor-330 .elementor-element.elementor-element-52ab571 .tutor-course-card {
        width: 100% !important;
        max-width: 380px !important;

        margin-left: auto !important;
        margin-right: auto !important;

        border-radius: 10px !important;
    }

    /* Compact content */

    .elementor-330 .elementor-element.elementor-element-52ab571 .td_card_info_in,
    .elementor-330 .elementor-element.elementor-element-52ab571 .tutor-course-card-body {
        padding: 12px 14px !important;
    }

    /* Dark navy mobile course titles */

    .elementor-330 .elementor-element.elementor-element-52ab571 .td_card_info_in h2,
    .elementor-330 .elementor-element.elementor-element-52ab571 .td_card_info_in h3,
    .elementor-330 .elementor-element.elementor-element-52ab571 .td_card_info_in h4,
    .elementor-330 .elementor-element.elementor-element-52ab571 .td_card_info_in h2 a,
    .elementor-330 .elementor-element.elementor-element-52ab571 .td_card_info_in h3 a,
    .elementor-330 .elementor-element.elementor-element-52ab571 .td_card_info_in h4 a,
    .elementor-330 .elementor-element.elementor-element-52ab571 .tutor-course-card .tutor-course-name a,
    .elementor-330 .elementor-element.elementor-element-52ab571 .tutor-course-card .tutor-course-title a {
        font-family: "Montserrat", Arial, sans-serif !important;

        font-size: 15px !important;
        font-weight: 700 !important;
        line-height: 1.4 !important;

        color: #0C2B48 !important;
    }

    /* Hide descriptions */

    .elementor-330 .elementor-element.elementor-element-52ab571 .td_card_subtitle,
    .elementor-330 .elementor-element.elementor-element-52ab571 .tutor-course-description {
        display: none !important;
    }

    /* Gold category */

    .elementor-330 .elementor-element.elementor-element-52ab571 .td_card_info_in .td_card_cat,
    .elementor-330 .elementor-element.elementor-element-52ab571 .tutor-course-card .tutor-course-category {
        font-size: 10px !important;
    }

}


/* ==========================================
   14. ACCESSIBILITY
   ========================================== */

@media (prefers-reduced-motion: reduce) {

    .elementor-330 .elementor-element.elementor-element-52ab571 .td_card,
    .elementor-330 .elementor-element.elementor-element-52ab571 .tutor-course-card {
        transition: none !important;
    }

}/* End custom CSS */