/* ============================================================
   FLIGHTLINE AVIATION ACADEMY — Custom Design Override
   White / Black Alternating Sections with HD Aviation BGs
   ============================================================ */

/* ============================================================
   PAGE WRAPPER — reset dark bg
   ============================================================ */
.page-wrapper.dark {
  background-color: #ffffff !important;
}

/* ============================================================
   1. BANNER SECTION — WHITE + AVIATION BACKGROUND
   ============================================================ */
.banner-section {
  background-color: #ffffff !important;
  /* background-image:
    linear-gradient(
      105deg,
      rgba(255, 255, 255, 0.97) 0%,
      rgba(255, 255, 255, 0.93) 45%,
      rgba(240, 248, 255, 0.68) 100%
    ),
    url('https://images.unsplash.com/photo-1436491865332-7a61a109cc05?auto=format&fit=crop&w=1920&q=80') !important; */
  background-size: cover !important;
  background-position: center 40% !important;
  /* border-bottom: 3px solid rgba(220, 187, 135, 0.25); */
}

/* Banner heading — dark on white */
.banner-section .banner-content .title {
  color: #0d1b2a !important;
  text-shadow: none !important;
}

/* Keep the gold span intact */
.banner-section .banner-content .title .text--base {
  color: #d0aa6d !important;
}

/* Body text — readable mid-gray on white */
.banner-section .banner-content p {
  color: #000000 !important;
}

/* Decorative element — subtle on white */
.banner-section .banner-element img {
  opacity: 0.12;
  mix-blend-mode: multiply;
}

/* CTA buttons — deeper red shadow on white */
.banner-section .banner-content .banner-btn a {
  box-shadow: none !important;
}
.banner-section .banner-content .banner-btn a:hover {
  box-shadow:
    0 8px 28px rgba(176, 20, 21, 0.55),
    0 4px 10px rgba(176, 20, 21, 0.30) !important;
  transform: translateY(-3px);
}

/* ============================================================
   2. ABOUT SECTION — BLACK + COCKPIT AVIATION BG
   ============================================================ */
.about-section.about--style.page-wrapper-two {
      background-image: linear-gradient(to right, rgb(0 0 0 / 67%) 0%, rgba(5, 10, 20, 0.87) 55%, rgb(8 16 30 / 43%) 100%), url(https://images.unsplash.com/photo-1436491865332-7a61a109cc05?auto=format&fit=crop&w=1920&q=80) !important;
  background-size: cover !important;
  background-position: center center !important;
  /* border-top: 3px solid rgba(220, 187, 135, 0.22);
  border-bottom: 3px solid rgba(220, 187, 135, 0.22); */
}

/* About section image — add subtle gold frame */
.page-wrapper-two .about-thumb img {
  /* border: 2px solid rgba(220, 187, 135, 0.35) !important; */
  /* box-shadow: 0 16px 48px rgba(0, 0, 0, 0.55) !important; */
}

/* ============================================================
   3. TRAINING COURSES — CLEAN WHITE
   ============================================================ */
.package-section.section--bg {
  background-color: #f7f8fa !important;
  background-image: none !important;
  border-bottom: 3px solid rgba(220, 187, 135, 0.25);
}

/* Mute the dark decorative elements on white bg */
.package-section .package-element-one,
.package-section .package-element-two {
  opacity: 0.04 !important;
  filter: invert(1) !important;
}

/* Course cards — elevated on white */
.package-item {
  background-color: #ffffff !important;
  box-shadow: 0 4px 20px rgba(13, 27, 42, 0.07) !important;
  border: 1px solid rgba(220, 187, 135, 0.18) !important;
  transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease !important;
}
.package-item:hover {
  transform: translateY(-8px) !important;
  box-shadow: 0 18px 44px rgba(13, 27, 42, 0.15) !important;
  border-color: rgba(220, 187, 135, 0.55) !important;
}

/* Card title — dark navy on white */
.package-content .package-content-header .title a {
  color: #19232d !important;
}

/* ============================================================
   4. CONTACT SECTION — BLACK + AIRPORT BG
   ============================================================ */
.contact-section {
    background-image: linear-gradient(135deg, rgba(0, 0, 0, 0.92) 0%, rgb(4 9 18 / 83%) 50%, rgba(0, 4, 12, 0.87) 100%), url(https://images.unsplash.com/photo-1569154941061-e231b4725ef1?auto=format&fit=crop&w=1920&q=80) !important;
    background-size: cover !important;
    background-position: center 30% !important;
}

/* ============================================================
   ABOUT SECTION — text color safeguards on dark bg
   ============================================================ */
.about-section.about--style.page-wrapper-two .about-content .sub-title {
  color: #ffffff !important;
}
.about-section.about--style.page-wrapper-two .about-content .sub-title.text--base {
  color: #dcbb87 !important;
}
.about-section.about--style.page-wrapper-two .about-content .title {
  color: #ffffff !important;
}

/* ============================================================
   5. HEADER TOP BAR — ensure contrast
   ============================================================ */
.top-bg {
  background-color: #b01415 !important;
}

/* ============================================================
   6. FOOTER — richer dark with aviation accents
   ============================================================ */
.footer-section {
  background-color: black !important;
  /* border-top: 3px solid rgba(220, 187, 135, 0.35) !important; */
}
.footer-section .footer-bottom-area {
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  padding-bottom: 40px;
}

/* ============================================================
   7. GLOBAL SECTION POLISH
   ============================================================ */

/* Gold accent underline for sub-titles */
.about-content .sub-title,
.section-header .sub-title {
  padding-bottom: 8px;
  position: relative;
}
.about-content .sub-title::after,
.section-header .sub-title::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 36px;
  height: 2px;
  background: linear-gradient(90deg, #dcbb87, rgba(220, 187, 135, 0));
  border-radius: 2px;
}

/* Smooth card image zoom */
.package-thumb {
  overflow: hidden;
  border-radius: 10px 10px 0 0 !important;
}
.package-thumb img {
  transition: transform 0.5s ease !important;
}
.package-item:hover .package-thumb img {
  transform: scale(1.06) !important;
}

/* ============================================================
   8. RESPONSIVE TWEAKS
   ============================================================ */
@media (max-width: 991px) {
  .banner-section {
    background-position: right 35% !important;
  }
  .about-section.about--style.page-wrapper-two {
    background-position: right center !important;
  }
  .contact-section {
    background-position: center center !important;
  }
}
@media (max-width: 767px) {
  .banner-section {
    background-image:
      linear-gradient(
        to bottom,
        rgba(255, 255, 255, 0.97) 0%,
        rgba(255, 255, 255, 0.95) 100%
      ),
      url('https://images.unsplash.com/photo-1436491865332-7a61a109cc05?auto=format&fit=crop&w=1200&q=75') !important;
  }
}